[feat] 환경변수 설정

Author: EunbinJung

next.config.ts

@@ -1,9 +1,12 @@
 import type { NextConfig } from 'next';
 
 const nextConfig: NextConfig = {
-
   // webpack 설정
   webpack: (config) => {
+    env: {
+      NPUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL;
+    }
+
     // @ts-expect-error 타입 에러 무시
     const fileLoaderRule = config.module.rules.find((rule) => rule.test?.test?.('.svg'));
 
@@ -37,7 +40,7 @@ const nextConfig: NextConfig = {
         loaders: ['@svgr/webpack'],
         as: '*.js',
       },
-    }
+    },
   },
 };
 

src.zip

@@ -0,0 +1,4 @@
+export const getApi =
+  process.env.NODE_ENV === 'development'
+    ? process.env.NEXT_PUBLIC_API_URL_DEV
+    : process.env.NEXT_PUBLIC_API_URL_PROD;

src/app/api/config/appConfig.ts

@@ -1,12 +1,12 @@
+import { getApi } from '@/app/api/config/appConfig';
 import { Post } from '../types/post';
 
 export const fetchComment = async (postId: number): Promise<Post[] | null> => {
   try {
-    const res = await fetch(`http://localhost:8080/posts/${postId}/comments`, {
+    const res = await fetch(`${getApi}posts/${postId}/comments`, {
       method: 'GET',
     });
     const data = await res.json();
-    console.log(data);
     return data.data;
   } catch (err) {
     console.error('해당 글의 댓글 조회 실패', err);

src/domains/community/api/fetchComment.ts

@@ -1,8 +1,9 @@
+import { getApi } from '@/app/api/config/appConfig';
 import { Post } from '@/domains/community/types/post';
 
 export const fetchPost = async (): Promise<Post[] | null> => {
   try {
-    const res = await fetch('http://localhost:8080/posts', {
+    const res = await fetch(`${getApi}posts`, {
       method: 'GET',
       cache: 'no-store',
     });

src/domains/community/api/fetchPost.ts

@@ -81,7 +81,7 @@ function PostCard({ posts, setPosts }: Props) {
                     postId={postId}
                   />
                 </div>
-                <figure className="flex items-center flex-shrink-0 w-[115px] h-[115px]">
+                <figure className="flex items-center flex-shrink-0 md:w-[115px] md:h-[115px] w-[85px] h-[85px]">
                   <Image
                     src={prePost}
                     alt="예비사진"