javascript

직접 만들어보는 To Do List - Express.js + React.js + SQLite (5)

리액트에서 express의 API 서버와 통신하도록 컴포넌트 별로 정리하여 작성하였습니다. 가장 기본적인 CRUD를 구현하기 위해서 props drilling과 fetch api를 활용하여 최대한 외부 라이브러리에 의존하지 않고 기능을 구현하는데 집중하였습니다

직접 만들어보는 To Do List - Express.js + React.js + SQLite (4)

SQLite를 이용해 express에서 CRUD를 구현하는 API 서버를 작성합니다. api/todos 를 통해서 들어오는 get,post,put,patch,delete 요청을 받고, 그에 알맞은 값을 응답하는 백엔드 소스를 작성합니다.

직접 만들어보는 To Do List - Express.js + React.js + SQLite (3)

Vite를 이용한 React 프로젝트 설정합니다. Express API 서버와 Vite 개발 서버가 동시 실행 되도록 Concurrently 라이브러리를 사용합니다. 흔히 겪는 CORS 설정, React 와 Express API 서버간의 통신 방법도 다룹니다.

직접 만들어보는 To Do List - Express.js + React.js + SQLite (2)

Express를 사용하여 API 서버를 구축하는 과정을 설명합니다. get, post, put, delete 메소드를 사용하여 CRUD를 구현하는 방법입니다. JSON 형태로 데이터를 전송하기 위한 설정 변경과 라우팅 처리 방법을 소개합니다.

직접 만들어보는 To Do List - Express.js + React.js + SQLite (1)

Express.js와 React.js를 이용한 To do list를 연재합니다. 프로젝트 폴더 생성 및 초기 설정부터 공부한 내용들을 정리했습니다. 백엔드 경험이 없는 입문자 입장에서 많은 설명을 덜어내고 바로 실행해볼 수 있는 것들 위주로 정리해보았습니다.

자바스크립트와 Node.js 그리고 express.js

자바스크립트를 중심으로 UI 작업을 해오던 웹개발 입문자의 입장에서 백엔드는 생소합니다. 프론트엔드만으로는 충분하지 않은 상태에서, 자바스크립트로 백엔드 입문 과정에서 많이 언급되는 Node.js와 Express.js 의 특징에 대해 간략하게 정리했습니다.

자바스크립트로 텍스트를 바꾸는 방법 3가지 - textContent, innerText, innerHTML

자바스크립트로 텍스트를 변경하는 방법 중 textContent, innerText, innerHTML을 소개합니다. 가장 추천하고 싶은 방법은 textContent입니다. 성능이 우수하고 보안적으로 안전해 효율적인 텍스트 변경에 적합하기에 적극 추천합니다.