본문 바로가기

기타

자바스크립트 라이브러리와 프레임워크, 어떤 순서로 공부할까

모던 웹 개발에서 Javascript는 빼놓을 수 없는 프로그래밍 언어입니다.

HTML과 CSS는 웹의 기본이기 때문에, 이미 공부했다고 치고~^^

자바스크립트를 어떤 순서로 공부해 나가야할지 정리해 보았습니다.

 

시작은 Javascript부터 

 

JavaScript: 웹 개발의 기본이 되는 프로그래밍 언어이며 다른 모든 주제를 이해하는 데 필수적입니다. JavaScript는 프런트엔드와 백엔드 개발 모두에 사용됩니다. JavaScript, 특히 ES6+ 기능에 대한 탄탄한 이해가 필요합니다.

 

 

프런트엔드 개발

프런트엔드 개발에는 Angular를 비롯해 Vue.js 같은 다양한 라이브러리와 프레임워크들이 있습니다. 현재 가장 많이 사용하는 React를 기준으로 설명합니다.

  1. React: 사용자 인터페이스, 특히 싱글 페이지 애플리케이션(SPA)을 구축하기 위한 JavaScript 라이브러리입니다. Next.js는 React를 기반으로 한 프레임워크이므로 React를 이해하는 것이 Next.js를 이해하는 데 중요합니다. JavaScript에 이어 React를 배우면 콤포넌트, 상태, 속성과 같은 프론트엔드 개발 개념에 대한 필요한 기초 지식을 얻을 수 있습니다.
  2. Next.js: 서버 측 렌더링 및 정적 사이트 생성과 같은 기능을 제공하는 React 프레임워크입니다. 성능과 SEO에 중요한 요소들입니다. Next.js를 사용하려면 React가 어떻게 동작하는지에 대한 이해가 필요하기 때문에 React에 익숙해진 후 Next.js를 다루는 것이 가장 좋습니다. 

 

백엔드 개발

  1. Node.js: 서버 측에서 JavaScript를 실행할 수 있게 하는 런타임 환경입니다. 백엔드 개발에 있어 Node.js를 이해하는 것이 중요하며, Express를 사용하고 서버 측 기능을 구축하기 이한 기본이 됩니다. 
  2. Express: Node.js의 가벼운 프레임워크로,  웹 애플리케이션 개발을 위한 강력한 기능들을 제공합니다. Node.js 기반으로 서버 측 애플리케이션과 API를 생성할 수 있게 해주기 때문에 Node.js 이후에 Express를 배우는 것이  좋습니다.  
  3. (혹시 필요하다면) GraphQL: 이것은 API를 위한 쿼리 언어이며, 데이터에 대해 정의한 타입 시스템을 사용하여 이러한 쿼리를 실행하는 런타임입니다. REST API에 대한 대안으로 사용됩니다.

 

타입스크립트

TypeScript는 정적 타입을 추가한 JavaScript의 상위 집합입니다. 큰 JavaScript 애플리케이션 개발을 더 쉽게 만들기 위해 설계되었습니다. JavaScript와 주요 프레임워크(예: React, Node.js)에 익숙해진 후 TypeScript를 배우는 것이 좋습니다. 더 구조화된 코딩 접근 방식을 도입하며, 특히 큰 프로젝트에 유용합니다. 모던 웹 개발에서 점점 더 필수 언어가 되고 있습니다.

 

정리하기

Javascript에서 시작해서 프런트엔드와 백엔드를 포괄하는 개발을 이해하고 싶다면 다음과 같은 순서로 공부해 보세요.

  1. JavaScript (웹 개발의 기초를 잡기 위해)
  2. React (프론트엔드 개발 및 사용자 인터페이스 구축 학습)
  3. Next.js (서버 측 렌더링 및 기타 기능을 통한 React 개발 고급화)
  4. Node.js (서버 측 JavaScript 실행)
  5. Express (Node.js로 백엔드 애플리케이션 및 API 구축)
  6. TypeScript (JavaScript 코드에 타입 안전성과 구조 추가)