Node.js/MyTodoList

Node.js/MyTodoList

[Node.js] 05. Sequelize

시퀄라이즈를 쓰는 이유는 자바스크립트 구문을 알아서 SQL로 바꿔주기 때문입니다. 따라서 SQL 언어를 직접 사용하지 않아도 자바스크립트만으로 MySQL을 조작할 수 있습니다. 시퀄라이즈를 사용해봅시다. 시퀄라이즈를 이용하면 js로 테이블을 만들 수 있습니다. 프로젝트와 함께 테이블 정보를 저장할 수 있어서 유용하겠죠. 그리고 시퀄라이즈 구문이 sql구문보다 사용하기가 간단해서 편리합니다. 시퀄라이즈를 사용하려면 설치해야겠죠. 서버에 시퀄라이즈를 설치합니다. $ npm i sequelize 설치가 완료되었으면, MyTodoList에 model 폴더를 생성합니다. 1. index.js 작성 시퀄라이즈를 사용하기 위해 index.js 파일을 만들어서 import 시킵니다. const fs = require(..

Node.js/MyTodoList

[Node.js] 04. CSS와 SCSS

우선 브라우저에서 기본적으로 적용시키는 css를 리셋시키고 직접 작업을 하기 위해 index.css에서 초기화를 시켜줍니다. (정석이 아닌 제 커스텀이니 여러분이 원하는 항목은 스스로 수정해서 커스텀하시기 바랍니다.) @charset "utf-8"; /* Webfont Setting : 1. font-family: 'Roboto', sans-serif; 2. font-family: 'Nanum Gothic', sans-serif; 3. font-family: 'Open Sans', sans-serif; 4. font-family: 'Lato', sans-serif; 5. font-family: 'Noto Sans KR', sans-serif; 6. font-family: 'Teko', sans-serif..

Node.js/MyTodoList

[Node.js] 03. React

마지막에 css를 제공할 예정이니, 각 태그들의 클래스명은 되도록 똑같이 따라하시길 바랍니다. 1. 설치하기 리액트를 만들기 위해 터미널에서 + 버튼을 눌러 새 터미널을 만듭니다. 경로가 MyTodoList에 있는지 잘 확인한 후, 아래 내용을 입력해서 리액트를 설치합니다. $ npx create-react-app client cd client npm start 경로를 클라이언트로 바꾸고 리액트를 실행시켜봅시다. 이 화면이 나온다면 성공입니다. 우선 서버와 클라이언트를 연결해줘야 합니다. 기존의 package.json이 아닌 클라이언트 안에 있는 package.json에 접근해서, "proxy": "http://localhost:8080" 이 항목을 추가합니다. 2. 파일 수정 및 정리 client>sr..

Node.js/MyTodoList

[Node.js] 02. REST API

"Representational State Transfer” 의 약자 REST 는 네트워크 아키텍처 원리의 모음이다. 여기서 '네트워크 아키텍처 원리'란 자원을 정의하고 자원에 대한 주소를 지정하는 방법 전반을 일컫는다. 간단한 의미로는, 웹 상의 자료를 HTTP 위에서 SOAP이나 쿠키를 통한 세션 트랙킹 같은 별도의 전송 계층 없이 전송하기 위한 아주 간단한 인터페이스를 말한다. 출처: 위키백과 1. Postman을 사용하여 통신 확인 app.js에 작성해두었던 //익스프레스가 지원해주는 restAPI app.get('/', function (req, res) { res.send('Hello World') }) 이 부분도 rest api에 해당하는 영역입니다. 여기서 app은 express모듈을 사용..

Node.js/MyTodoList

[Node.js] 01. 시작하기(express)

Node.js와 React를 이용하여 나만의 Todolist를 만들어봅시다. Todolist를 이용하면 기본적인 데이터 처리 기능 CRUD(create, read, update, delete)를 구현할 수 있으므로 모든 API 시작과 끝을 맛볼 수 있게 됩니다. 학습목록 NodeJS MySQL Express Sequelize React 1. 환경세팅 에디터는 vscode를 이용하도록 하겠습니다. 없으신 분들은 설치하시면 됩니다. 제가 사용하는 vscode extension에 관한 정보는 추후에 업데이트 하도록 하겠습니다. node와 mySQL도 자신의 환경에 맞게 설치합니다. 2. 원하는 위치에 MyTodolist폴더를 생성합니다. 저는 onedrive때문에 바탕화면이 아닌, user 디렉토리 안에 my..

hyun_ji
'Node.js/MyTodoList' 카테고리의 글 목록