| static static으로 서버에 있는 자원을 열어 줄 수 있다. 예를 들어 제품 사진을 판매자가 업로드를 했다면 서버의 특정 폴더에 해당 사진을 저장한다. 이때 static으로 열어두면 클라이언트에서 업로드한 이미지를 볼 수 있게 된다. node 폴더에 public 폴더를 만든 후 public 폴더 아래에 images 폴더를 만든다. images 폴더 내에 nodemon.png 파일을 넣는다. 브라우저에서 "http://localhost:3000/images/nodemon.png"로 접근이 가능해진다. // 15_static.js const express = require("express"); const app = express(); // http://localhost:3000/images/nod..

| route 정규 표현식 사용 정규 표현식을 이용할 수 있다. 경로 우선순위는 위에서 아래이다. 실무에서는 이 우선순위를 이용해 설계하기도 한다. // 12_route.js const express = require("express"); const app = express(); app.listen(3000, () => { console.log("서버가 포트 3000번으로 시작되었습니다."); }); // ? 0개 혹은 1개, /abcd, /acd app.get("/ab?cd", (req, res) => { res.send("ab?cd"); }); // b가 1개 이상 app.get("/ab+cd", (req, res) => { res.send("ab+cd"); }); // b와 C 사이에 아무 것도 없..

| dotenv 아래 코드는 민감정보를 포함하고 있어 깃허브에 올라가면 안 된다. dotenv 모듈을 이용하면 민감정보를 감출 수 있다. // mysql/index.js ... const pool = mysql.createPool({ host: "localhost", port: 3306, user: "dev", password: "1234", database: "dev", connectionLimit: 10, }); ... dotenv 모듈 설치 npm i dotenv .env 파일에 민감 정보들이 있다. .gitignore에 이 파일을 포함시키면 된다. // mysql/.env MYSQL_HOST=localhost MYSQL_PORT=3306 MYSQL_USERNAME=dev MYSQL_PASSWORD..

| 라우팅 PUT DB 데이터를 수정하는 기능이다. mysql.query에서 파라미터를 배열로 받는 점을 유념하자! // 11_app_mysql.js ... app.put("/api/product/category/:product_category_id", async (req, res) => { const { product_category_id } = req.params; const result = await mysql.query("categoryUpdate", [ req.body.param, product_category_id, ]); res.send(result); }); mysql.query의 배열 파라미터는 아래 코드의 커리문 내 '?'와 각각 대응한다. // mysql/sql.js module.ex..

| Express Express 설치 터미널 창에서 아래 명령어를 실행하여 "package.json" 파일을 생성한다. npm init Express를 설치한다. npm i express 생성된 "package.json"은 다음과 같다. // package.json { "name": "node", "version": "1.0.0", "description": "", "main": "10_app.js", "scripts": { "test": "node 10_app.js" }, "author": "Sewol", "license": "ISC", "dependencies": { "express": "^4.17.3", } } express로 웹 서버 구동 // express const express = requi..

| 당근마켓 분석 당근마켓 서비스의 상세페이지를 분석하여 테이블과 컬럼을 작성해보았다. | DB 생성 분석 결과를 토대로 MySQL에서 [그림 1]과 같이 DB를 생성하였다. ※ [그림 2]의 Foreign Key Name은 다른 테이블에서 동일하게 사용 할 수 없었다.

부트캠프 20차시에서 Vue.js의 slot 기능을 적용한 Modal 구현을 실습하였는데 그 내용을 다음과 같이 정리하였다. 자식 컴포넌트를 부트스트랩 디자인의 Modal 컴포넌트로 만들고 부모 컴포넌트에서 자식 컴포넌트를 이용해 하나 이상의 Modal을 구현하고자 한다. | 자식 컴포넌트 부트스트랩 적용 components의 fragments 폴더에 SlotModal.vue 파일을 생성한 후 태그 안에 "부트스트랩 > Components > Live demo"에서 이하를 copy 하여 붙여 넣는다. Modal title ... Close Save changes slot 및 v-bind 적용 부모 컴포넌트에서 하나 이상의 Modal을 생성하기 위해서 id를 props의 modalId와 바인딩한다. mod..

| w3schools.com에서 SELECT 연습 Tutorials > Learn MySQL > MySQL HOME > Try it Yourself https://www.w3schools.com/mysql/trymysql.asp?filename=trysql_select_all MySQL Tryit Editor v1.0 WebSQL stores a Database locally, on the user's computer. Each user gets their own Database object. WebSQL is supported in Chrome, Safari, and Opera. If you use another browser you will still be able to use our Try SQL ..