imysydesu 님의 블로그

순서 1. 백엔드로 만들었던 js 파일 연결2. html 생성3. js 생성4. css 생성 백엔드로 만들었던 js 파일 연결 - 기존 백엔드 js파일에 작성const path = require("path")app.use(express.static(path.join(__dirname, "public"))) 차례대로Node.js 내장 모듈인 path를 가져옴 => 파일 경로를 안전하게 만들어주는 역할public : 연결할 프론트의 파일들이 담긴 폴더 이름static : public 폴더 안에 있는 파일들은 브라우저가 직접 접근할 수 있게 해줌path.join : 폴더/파일 경로 만들어주는 함수__dirname : 현재 실행 중인 js파일(백엔드 파일)이 있는 폴더의 절대 경로 ..

순서 필요한 모듈 불러오기Express 서버 기본 설정MongoDB 연결 준비서버 시작 함수메모 조회 API메모 추가 API메모 수정 API메모 삭제 API 필요한 모듈 불러오기 const express = require("express")const path = require("path")const { MongoClient, ObjectId, ReturnDocument } = require("mongodb") express : 서버를 쉽게 만들게 해주는 라이브러리, app.get() app.post() 등 사용 가능path : 파일 경로를 다룰 때 사용MongoClient : MongoDB에 연결하는 객체를 만들 때 사용ObjectId : _id값을 다룰 때 사용 ..

1 . MongoDB MySQL 데이터베이스 시스템 중 하나문서 지향 데이터베이스관계형 데이터베이스와는 다르게 데이터를 테이블이 아니라 JSON 스타일의 BSON(Binary JSON) 형식의 문서로 저장개발자가 유연하게 데이터를 저장하고 쿼리할 수 있도록 만들어짐대규모 분산 데이터 환경에서도 잘 작동함스키마가 없다는 특징을 가지고있음=> ex) {"no": 1, "userid":"apple", "userpw":"1111"} {"no": 2, "userid":"banana", "userpw":"2222", "email":"banana@banana.com"} {"userid":"오렌지", "hp":"010-1111-1111", } 위 세 개의 문서 ..

1 . 게시물 작성 => 어떤 순서대로 작성했는지 생각하기 기본으로 작성하는 내용 1 - 1 . 게시물 저장 ejs 파일 js 파일 => 위에서 data 폴더에 posts.txt 파일을 만들어 저장한다 선언했으므로 해당 파일이 생성됨=> 경로는 /posts이므로 접속 경로는 127.0.0.1:3000/posts임=> 내용은(body) title과 content로 두 가지임 appendFile을 통해 기존 파일의 끝에 내용을 추가하며 리스트를 생성해냄 => redirect() : 페이지를 이동 시킴, get으로만 가능 - 내용(title, content)을 추가할 때 오류가 나지 않았으면 /posts 경로로 페이지 이동 1 - 2 . 게시물 리스트 =>..

1 . 이론 정리 Node.js 브라우저 밖에서도 자바스크립트를 실행할 수 있도록 만든 서버 즉 자바스크립트 실행 환경구글의 V8 엔진을 기반으로 동작함웹 서버, API 서버, 실시간 채팅, 스트리밍 서비스 등 활용npm (Node Package Manager)을 통해 수많은 오픈 소스 패키지를 쉽게 사용할 수 있어 빠른 개발이 가능함프론트엔트와 동일한 언어(JavaScript)를 사용한다는 점에서 풀스택 개발에 매우 유리한 환경 프론트엔드, 백엔드 역할 차이 프론트엔드는 사용자가 직접 보고 상호작용하는 화면(UI)을 구현하는 영역HTML/CSS.JavaScript를 사용해 버튼, 입력창, 화면 레이아웃, 애니메이션 등 사용자 경험을 담당백엔드는 사용자의 요청을 받아 데이터를 처리하고..