React와 Next.js에 대한 갈망이 늘 있어왔다.

실무에서 React를 1년 반 정도 다루었지만, 좀 더 깊이있게 공부할 필요성을 느끼고 있었다.

그러던 도중, 짐코딩 TailwindCSS, React, Next.js 강의를 마주하게 되었다. 5월 초부터 하나하나 진도를 빼고 있는 중이다.

우선 TailwindCSS 강의부터 먼저 수강했다. styled-components도 충분히 좋은 라이브러리라고 생각되지만, 전체적인 진입장벽 자체가 많이 높다는 느낌을 받았다. 특히 container 정의하는 부분에서 일관성을 가지고 구현하는게 너무 힘들었다. 중복되는 코드를 어떻게 줄여나가야 하는지.. 어떻게 간결하게 코딩할 수 있는지에 대한 스트레스가 꽤나 심했다.

그리고 많은 개발자들을 좌절에 빠지게 만드는 레이아웃 구성.. 어쩌면 UI 개발의 꽃이라 생각되는 부분인데, 늘 부담을 느낄수밖에 없었다. TailwindCSS는 이러한 부담을 조금 덜어주는 훌륭한 프레임워크라는 느낌을 많이 받았다.

계속 사용해보면서, 그 진가를 하나하나 알아가려 한다.

차후에 v0.dev를 사용하게 될텐데.. 그것도 결국 TailwindCSS 기반으로 스타일링 이루어지는 부분이기 때문에 잘 알고 대응해야 할 것 같다. 아무리 AI Assistant가 코드를 잘 짜준다 하더라도, 어디까지나 도구로써의 가치가 있는것이지 그것이 메인이 될수는 없을거라 생각한다.

React 강의에서는 JavaScript로 진행되었으나, 현 시점에서 TypeScript를 안쓰면 안되는 상황에서 스스로 TypeScript로 구현해보았다. TypeScript 숙련도를 높이기 위한 일환이었는데, 조금 멀리 가더라도 타입 강제에 대한 중요성을 느낄 수 있었다.

이번주부터는 <Next.js 완벽 마스터> 라는 강의를 수강하기 시작했다.

Next.js가 다루는 내용이 워낙 방대하기에, 핵심적인 부분부터 빠르면서도 정확하게 해야한다는 것을 느끼게 되었다.

일단 Next.js를 왜 사용하는지?? 에 대한 해답을 줄 수 있는 여러가지 웹 렌더링 방식에 대해 정리해보았다.

CSR, SSR, SPA, SSG, ISR에 대하여 학습했다. 각각에 대해 잘 설명할 수 있도록 꾸준히 익혀야 할 것이다. 어떠한 상황에서 어느 기술을 이용해야 할 지 잘 판단하여 사용해야 할 것이다.

그리고 Cursor AI에 대해 학습해보았다. 실무에서 사용해본적이 없기 때문에 다소 생소하게 느껴졌으나, Perplexity와 JetBrains AI Assistant를 활용해본 경험을 토대로 AI Chat(구. Composer)의 적응에 총력을 기울였다.

단순히 문답만 하는 것을 넘어서, 어떻게 템플릿을 구성하여 질의해야 하는지에 대한 기반을 다질 수 있었다.

어떻게 구현하는지도 중요하지만, 어떻게 질문하는지도 중요한 능력이 되어간다는 것을 느끼게 되었다.

Next.js 프로젝트 구성에 대해서도 살펴보았다.

현재 기준 최신버전은 15.3.3인데, 강의에서는 13 이후부터 지원되는 App Router 기반으로 학습할 수 있도록 구성되어 있었다. App Router 기반으로 구현해보고싶었던 나로서는 좋은 기회라 생각된다.

TypeScript, ESLint, Prettier 설정을 통해 프로젝트 내의 코드 규칙들을 일관성있게 가져갈 수 있도록 구성하였다.

그 후, TailwindCSS v4와 shadcn/ui를 통해 스타일링에 도움을 줄 수 있는 요소들까지 구성해보았다.

모든 구성을 마친 후, App Router 기반 페이지 라우트와 동적 라우트에 대해 학습했다.

블로그 메인 UI와 상세 목차 UI도 구성해보았다. 이 과정에서 Notion과의 연동까지 진행했다.

이번주에 익힌 것들을 확인해보니, 굉장히 흥미로운 주제들을 아주 밀도있게 학습했다.

솔직히 버겁긴하다. 생각했던 것보다 많이 어렵다는것을 느낀다. 그렇지만 최대한 긍정적으로 생각해보려 한다.

어렵다는건 돌려말하면, 가능성이 있다는 것이다.

단지 익숙하지 않아서 발생하는 하나의 과정일 뿐이다.

쉽다면 누구나 다 뛰어들었을 것이다. 어쩌면 어려운 것은 당연한 것이다.

어렵기 때문에 희소가치가 있는 것이고, 그것을 이겨내야만 비로소 원하는 목표에 도달할 수 있을거라 생각한다.

이번 주 학습을 통해 느낀 점

• AI Assistant -> 훌륭한 도구

  • 거칠게 보자면, 도구일 뿐이지 그것이 메인이 될수는 없다.

  • AI가 구현해주는 것에 전적으로 의존해서는 안된다.

  • 오답을 정답처럼 꾸며내는 행위도 적지않게 하므로, 공신력있는 문서를 통해 반드시 교차검증을 진행해야 한다.

     

• Next.js 프로젝트 구성

• shadcn/ui에 대한 이해