React/Next.js3 [NextJS] Ubuntu Docker(도커) 이미지 빌드·컨테이너 실행 하기 간단 설명 목록 설명 Dockerfile Dockerfile은 도커 이미지를 빌드하기 위한 빌드 지시사항들을 포함한 텍스트 파일입니다. Dockerfile은 컨테이너 이미지를 구성하는 데 필요한 모든 단계와 명령을 정의합니다. .dockerignore 도커 빌드 과정에서 제외할 파일과 디렉토리를 지정하는 파일입니다. Dockerfile을 작성할 때 모든 파일이나 디렉토리를 이미지에 포함시키는 것은 필요하지 않을 수 있습니다. 특정 파일이나 디렉토리를 이미지 빌드 과정에서 제외할 수 있습니다. docker-compose 여러 컨테이너로 구성된 멀티 컨테이너 애플리케이션을 정의하고 구성하기 위해 사용되는 도구입니다. 애플리케이션의 서비스, 네트워크, 볼륨, 환경 변수 등을 정의할 수 있습니다. Docker .. 2023. 6. 1. [NextJS] Isotope-layout `window is not define` 오류 해결하기 `NextJS`에서 `isotope-layout`를 사용하려고 하면, `SSR` 환경에서는 `window is not define` 오류가 발생할 수 있습니다. 그래서 `Isotope`를 사용하는 곳을 `SSR을 풀어주고 다이내믹 링크를 통하여 해결`해볼 수 있습니다. 예제 `Home.tsx` const DynamicPortfolio = dynamic( () => import('src/components/Portfolio/portfolio'), { ssr: false, }, ) export default function Home() { return ( {/* */} {/* ... 등등 */} ) } `Portfolio.tsx` declare module Portfolio { interface Data {.. 2023. 1. 1. [NextJS] Swiper `swiper.params.navigation undefined` 해결하기 스와이퍼(Swiper)를 쓰다 보면, Init 과정에서 문제가 생기는 경우 간혹 발생이 됩니다. 인입되는 시점을 변경해 준다면, swiper를 쓰는데 크게 문제는 발생되지 않을 겁니다. 아래의 예제를 통해서 확인하여 수정하면 정상적으로 작동될 겁니다. 원래는 타입스크립트(Typescript)로 사용하지만, 예제는 자바스크립트(Javascript)이니 타입만 추가로 넣어주시면 될 것 같습니다. 변경 전 현재 스와이퍼(Swiper) 기준으로 최신 버전이 8.4.5입니다. 참고하여 수정하시면 될 것 같습니다. import { Swiper, SwiperSlide } from "swiper/react"; import SwiperCore, { Autoplay, Pagination, Navigation } from .. 2022. 12. 17. 이전 1 다음
