Next.js와 React의 차이점

React는 라이브러리고, Next.js는 프레임워크다.라이브러리코드 내에서 내가 사용하는 것이므로, 원하는 아키텍처를 사용하여 원하는 언어, 원하는 방식으로 코드 작성 할 수 있음사용의 주체가 개발자에게 있음ReactUI 인터페이스를 build하는데 사용하는 라이브러리반응형 사용자 인터페이스를 구현하는 데 사용함프레임워크프레임워크가 개발자의 코드를 사용하므로, 프레임워크가 개발자를 대신해 많은 것들을 해준다사용의 주체가 프레임워크에 있음Next.js는 React와 달리, import하는 개념이 아니다!

  • format_list_bulleted Frontend/Next.js
  • · 2025. 5. 12.

Vite란?

Vite(비트)Vue SFC를 지원하는 매우 가볍고 빠른 빌드 도구특징개발 서버를 구동할 때 매우 빠르다소스 코드에 변경이 일어났을 때, 전체 모듈을 번들링 하는게 아니라 변경된 모듈만 교체한다 vite.config.jsVite의 환경 설정 파일

  • format_list_bulleted Frontend/Vue.js
  • · 2024. 12. 1.

컴포넌트(Component)에 대해서

컴포넌트(Component)란?UI(HTML, CSS, JS)를 재사용 가능하도록 정의한 것  컴포넌트를 사용하는 이유는 뭘까?UI 재사용HTML, CSS, JS를 컴포넌트로 캡슐화 한 후 반복적으로 사용해야할 때 사용한다클린 코드컴포넌트를 독립적으로 분리하면, 유지보수를 보다 쉽게 할 수 있다  컴포넌트를 만들고 사용해보기컴포넌트 정의 → 컴포넌트 등록 → 컴포넌트 사용  컴포넌트 정의2가지 방법이 있다- 문자열 템플릿- Single File Component  문자열 템플릿 (string template)export default { data() { return { subtitle: '마트명' } }, template: ` {{ subtitle }} ..

  • format_list_bulleted Frontend/Vue.js
  • · 2024. 11. 17.

Vue는 무엇일까?

Vue는 ...User Interface 개발을 위한 자바스크립트 프레임워크HTML, CSS, JavaScript 기반으로 단순하거나 복잡한 UI를 효율적으로 개발하는 데 도움을 준다 Vue의 핵심 기능선언적 렌더링(Declarative Rendering)Vue는 템플릿 구문( {{ }} )으로 데이터를 선언적으로 렌더링 할 수 있다반응성(Reactivity)Vue는 JavaScript 상태 변경을 자동으로 추적하고, 변경이 발생하면 DOM을 효율적으로 업데이트한다

  • format_list_bulleted Frontend/Vue.js
  • · 2024. 11. 17.
Vue.js 개발하기 전, 설치하면 좋은 VSCode와 크롬 확장 프로그램

Vue.js 개발하기 전, 설치하면 좋은 VSCode와 크롬 확장 프로그램

✌️VSCode 확장 프로그램indent-rainbow들여쓰기할 때, 색깔을 넣어줘서 가독성을 높여준다  Auto Rename Tag태그 생성 및 수정시, 하나만 생성 및 수정하면 나머지 태그도 자동으로 반영해준다  CSS Peekhtml에서 선언된 css를 어디서 선언했는지 쉽게 찾을 수 있도록 도와준다   HTML to CSS autocompletion, HTML CSS Supporthtml과 css의 자동완성을 지원한다  Live Server코드를 자동 반영해주는 DEV 서버의 역할을 한다  ESLint코드 검사기, 코드에 에러가 있는지 검사해준다 Vue-OfficialVue 공식 확장 프로그램Vue VSCode Snippets싱글 파일 컴포넌트의 양식을 빠르게 생성해준다   ✌️ 크롬 확장 프로그..

  • format_list_bulleted Frontend/Vue.js
  • · 2024. 11. 17.