Skip to content

Commit

Permalink
chore: 코드리뷰 반영
Browse files Browse the repository at this point in the history
  • Loading branch information
Andrevile committed Jul 13, 2024
1 parent 4a87f71 commit 815f7da
Show file tree
Hide file tree
Showing 11 changed files with 70 additions and 109 deletions.
1 change: 0 additions & 1 deletion apps/web/app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ export default function RootLayout({
return (
<html lang="en">
<body className={inter.className}>
{/* {children} */}
<QueryClientProvider>{children}</QueryClientProvider>
</body>
</html>
Expand Down
29 changes: 2 additions & 27 deletions apps/web/app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,28 +1,3 @@
import { HydrationBoundary, QueryClient, dehydrate } from '@tanstack/react-query';
import { FirstDomainExampleScreen } from '@sambad/web-domains/first-domain';

import { checkAPI } from '../../../packages/web-domains/src/common/apis/check.api';
import { FirstFeatureOfFirstDomainTestContainer } from '../../../packages/web-domains/src/first-domain/features/containers/FirstFeatureOfFirstDomainTestContainer';

import styles from './page.module.css';

export default async function FirstDomainExampleScreen() {
const queryClient = new QueryClient();

await queryClient.prefetchQuery({
queryKey: ['health'],
queryFn: async () => {
return await checkAPI.Ping('');
},
});

return (
<main className={styles.main}>
<HydrationBoundary state={dehydrate(queryClient)}>
<div>
<h1>도메인 화면을 전체 담당 하는 컴포넌트입니다.</h1>
<FirstFeatureOfFirstDomainTestContainer />
</div>
</HydrationBoundary>{' '}
</main>
);
}
export default FirstDomainExampleScreen;
6 changes: 1 addition & 5 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,9 @@
"generate:package": "turbo gen package-template"
},
"dependencies": {
"@emotion/react": "^11.11.4",
"@tanstack/react-query": "^5.50.1",
"axios": "^1.7.2",
"qs": "^6.12.3"
"@emotion/react": "^11.11.4"
},
"devDependencies": {
"@types/qs": "^6.9.15",
"cspell": "^8.10.0",
"husky": "^9.0.11",
"next": "14.2.4",
Expand Down
7 changes: 6 additions & 1 deletion packages/web-domains/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,11 @@
"lint": "eslint . --max-warnings 0",
"type-check": "tsc --noEmit"
},
"dependencies": {},
"dependencies": {
"@tanstack/react-query": "^5.50.1",
"axios": "^1.7.2",
"qs": "^6.12.3"
},
"devDependencies": {
"@sambad/sds": "workspace:*",
"@sambad/eslint-config": "workspace:*",
Expand All @@ -20,6 +24,7 @@
"@types/eslint": "^8.56.5",
"@types/react": "^18.2.61",
"@types/react-dom": "^18.2.19",
"@types/qs": "^6.9.15",
"eslint": "^8.57.0",
"react": "^18",
"typescript": "^5.3.3"
Expand Down
39 changes: 13 additions & 26 deletions packages/web-domains/src/common/apis/base.api.ts
Original file line number Diff line number Diff line change
@@ -1,41 +1,28 @@
import axios, { AxiosRequestConfig, AxiosInstance } from 'axios';
import axios from 'axios';
const baseURL = `/api`;

export class Http {
private instance: AxiosInstance;
constructor(path: string) {
path = path.startsWith('/') ? path.slice(1) : path;

this.instance = axios.create({
baseURL: `${baseURL}/${path}`,
});
}
const axiosInstance = axios.create({
baseURL: baseURL,
});

protected async GET<Response = unknown>(url: string, config?: AxiosRequestConfig) {
const response = await this.instance.get<Response>(url, config);
export class Http {
static async GET<Response = unknown>(...args: Parameters<typeof axiosInstance.get>) {
const response = await axiosInstance.get<Response>(...args);
return response.data;
}

protected async POST<Request = unknown, Response = unknown>(
url: string,
payload?: Request,
config?: AxiosRequestConfig,
) {
const response = await this.instance.post<Request, Response>(url, payload, config);
static async POST<Request = unknown, Response = unknown>(...args: Parameters<typeof axiosInstance.post>) {
const response = await axiosInstance.post<Request, Response>(...args);
return response;
}

protected async PUT<Request = unknown, Response = unknown>(
url: string,
payload?: Request,
config?: AxiosRequestConfig,
) {
const response = await this.instance.put<Request, Response>(url, payload, config);
static async PUT<Request = unknown, Response = unknown>(...args: Parameters<typeof axiosInstance.put>) {
const response = await axiosInstance.put<Request, Response>(...args);
return response;
}

protected async DELETE<Response = unknown>(url: string, config?: AxiosRequestConfig) {
const response = await this.instance.delete<Response>(url, config);
static async DELETE<Response = unknown>(...args: Parameters<typeof axiosInstance.delete>) {
const response = await axiosInstance.delete<Response>(...args);
return response.data;
}
}
11 changes: 0 additions & 11 deletions packages/web-domains/src/common/apis/check.api.ts

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import { QueryClient, useQuery } from '@tanstack/react-query';

import { Http } from '../base.api';

const ping = () => Http.GET<any>('/actuator/health');

export const useHealthCheckQuery = () => {
const { data } = useQuery({
queryKey: ['health'],
queryFn: ping,
});

return { data };
};

export const useHealthCheckPrefetchQuery = async () => {
const queryClient = new QueryClient();

const prefetchedData = await queryClient.prefetchQuery({
queryKey: ['health'],
queryFn: ping,
});

return {
queryClient,
prefetchedData,
};
};
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
'use client';
import { isServer, QueryClient, QueryClientProvider as TanstackProvider } from '@tanstack/react-query';

import type { ReactNode } from 'react';
import type { PropsWithChildren } from 'react';

const makeQueryClient = () => {
return new QueryClient({
Expand All @@ -28,7 +28,7 @@ const getQueryClient = () => {
return browserQueryClient;
};

export const QueryClientProvider = ({ children }: { children?: ReactNode }) => {
export const QueryClientProvider = ({ children }: PropsWithChildren) => {
const queryClient = getQueryClient();

return <TanstackProvider client={queryClient}>{children}</TanstackProvider>;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,22 +1,11 @@
import { useQuery } from '@tanstack/react-query';
import { useEffect, useState } from 'react';

import { checkAPI } from '../../../common/apis/check.api';
import { useHealthCheckQuery } from '../../../common/apis/queries/useHealthCheckQuery';

export const useFirstFeatureOfFirstDomainService = () => {
const [displayText, setDisplayText] = useState<string>('');

const { data } = useQuery<any>({
queryKey: ['health'],
queryFn: async () => {
return await checkAPI.Ping('');
},

select: (data) => {
console.log(data);
},
});

const { data } = useHealthCheckQuery();
useEffect(() => {
console.log(data);
}, [data]);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,18 +1,10 @@
import { HydrationBoundary, QueryClient, dehydrate } from '@tanstack/react-query';
import { HydrationBoundary, dehydrate } from '@tanstack/react-query';

import { checkAPI } from '../../common/apis/check.api';
import { useHealthCheckPrefetchQuery } from '../../common/apis/queries/useHealthCheckQuery';
import { FirstFeatureOfFirstDomainTestContainer } from '../features/containers/FirstFeatureOfFirstDomainTestContainer';

export const FirstDomainExampleScreen = async () => {
const queryClient = new QueryClient();

await queryClient.prefetchQuery({
queryKey: ['health'],
queryFn: async () => {
return await checkAPI.Ping('');
},
});

const { queryClient } = await useHealthCheckPrefetchQuery();
return (
<HydrationBoundary state={dehydrate(queryClient)}>
<div>
Expand Down
25 changes: 13 additions & 12 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 815f7da

Please sign in to comment.