설계?유지보수 잘 하려면 코드를 이쁘게 짜 놓아야 한다. 하지만 코드를 이쁘게 짜겠다는 선언만으로는 그렇게 할 수 없다. 건물을 지으려면 땅에 줄부터 그어놔야 하듯이 코드가 올라갈 기반도 뭔가 틀이 잘 잡혀야 코드를 깔끔하게 올릴 수 있는데 이번 시리즈에서는 설계를 위한 다양한 시도 끝에 내가 얼추 픽스하려고 하는 것들을 남겨보려고 한다. Nextjs의 레이아웃나는 레이아웃의 설계가 상당히 중요하다고 생각한다. 컴포넌트가 어디에 배치되고 어디에 표시될지 명확하게 설계가 되어야 앞으로 올릴 컴포넌트들을 블록 쌓듯이 착착착 올릴 수 있기 때문이다. 그런 점에서 Next.js에서 제공하는 레이아웃은 기능별, 페이지별 분리가 너무나도 편하게 설계가 되어있어 사용하기 편하다. 레이아웃에 대한 Next.js의 공식..
PuTTY로 클라우드 컴퓨터 원격 접속 SSH (Secure Shell) 네트워크 상 다른 컴퓨터의 쉘을 사용할 수 있게 해주는 프로그램 혹은 프로토콜을 의미한다. 연결 이전에 서버 또는 사용자가 Key Pair를 생성한다. Key Pair는 공개 키와 개인 키 두 가지로 이루어진 한 쌍을 뜻한다. 공개 키(Public Key)는 .pub, 개인 키(Private Key)는 .pem의 파일 형식을 띄고 있다. 개인 키는 사용자(client)에게 제공되며, 보안이 필수적이다. 22번 포트는 SSH의 기본포트이다. https://library.gabia.com/contents/infrahosting/9002/ 가비아 라이브러리 IT 콘텐츠 허브 library.gabia.com 나중에 위 사이트를 한번 더 참..
1. next.js 인스톨 pnpm create next-app@version 필자는 typescript, tailwind 신봉자이므로 이 둘은 꼭 설치한다. 2. ESLint, Prettier 인스톨 pnpm i -D eslint-config-prettier eslint-plugin-tailwindcss prettier eslint-config-prettier는 prettier와 eslint의 충돌을 막기 위해 설치한다.. eslint-plugin-tailwindcss는 tailiwind 전용 린트 역할을 하는 플러그인이다. prettier는 모두다 아는(?) 그 포맷터이다. 설치 후 eslintrc, package.json, .prettierrc, .prettierignore에 스크립트 셋팅을 한다...
react-quill https://quilljs.com/ Quill - Your powerful rich text editor Sailec Light Sofia Pro Slabo 27px Roboto Slab Inconsolata Ubuntu Mono Quill Rich Text Editor Quill is a free, open source WYSIWYG editor built for the modern web. With its modular architecture and expressive API, it is completely customizable to fit any ne quilljs.com quill은 유명한 위지위그 에디터로 많은 사람들이 애용하고 있는 오픈소스다. react-quill 라..
