npm i express 로 백엔드 부분 생성 app.js를 만들어주고 cors 미들웨어 설치 npm i cors // 모든 도메인에 대해서 CORS 허용해주도록 설정 import express from "express"; import cors from "cors"; const app = express(); app.use(cors()); // cdpn.io에서 들어오는 요청은 특별히 허용해주도록 설정 import express from "express"; import cors from "cors"; const app = express(); const corsOptions = { origin: "*", }; app.use(cors(corsOptions)); fly.io Windows 에서 설치 윈도우는 새..

React와 Express를 활용한 사진 앨범 만들기안녕하세요. 오늘은 React와 Express를 활용하여 간단한 사진 앨범 웹 어플리케이션을 만드는 방법에 대해 자세히 알아보겠습니다.1. 프로젝트 구조프로젝트는 크게 두 부분으로 나뉘어져 있습니다. 프론트엔드는 React를 사용하며, 백엔드는 Express.js와 MySQL을 사용합니다.프론트엔드는 다음과 같은 구조로 이루어져 있습니다:App.js: 라우팅을 담당하는 메인 컴포넌트입니다.pages: 각 페이지 컴포넌트를 담고 있습니다. (Home, MyPage, UploadPage 등)components: 재사용 가능한 컴포넌트들을 담고 있습니다.백엔드는 Express.js를 사용하여 API를 구축하며, 데이터는 MySQL 데이터베이스에 저장됩니다.2..

빈 폴더를 하나 만들고 터미널을 열고 npm create vite@latest √ Project name: . or 생성할 폴더명(본인이름) √ Package name: movie-app √ Select a framework: » React √ Select a variant: » JavaScript npm install npm run dev # 스타일 컴포넌트 npm install styled-components # 라우터 npm install react-router-dom src 폴더에 App.jsx, main.jsx 말고는 다 삭제하고 남겨준다. App.jsx 는 옆에 저 코드가 시작코드이다. 다 삭제하고 저렇게 만들어준다. main.jsx 코드이다. 또 리액트는 컴포넌트로 분리시켜 유지보수와 편리성..

npm i express # npm node_modules package-lock.json *.log *.gz # Coveralls .nyc_output coverage # Benchmarking benchmarks/graphs app.js // app.js import express from "express"; const app = express(); const port = 3000; app.get("/", (req, res) => { res.send("Hello World!"); }); app.get("/about", (req, res) => { res.send("About!"); }); app.get("/setting", (req, res) => { res.send("Setting!"); }); a..

체육복 문제 설명 점심시간에 도둑이 들어, 일부 학생이 체육복을 도난당했습니다. 다행히 여벌 체육복이 있는 학생이 이들에게 체육복을 빌려주려 합니다. 학생들의 번호는 체격 순으로 매겨져 있어, 바로 앞번호의 학생이나 바로 뒷번호의 학생에게만 체육복을 빌려줄 수 있습니다. 예를 들어, 4번 학생은 3번 학생이나 5번 학생에게만 체육복을 빌려줄 수 있습니다. 체육복이 없으면 수업을 들을 수 없기 때문에 체육복을 적절히 빌려 최대한 많은 학생이 체육수업을 들어야 합니다. 전체 학생의 수 n, 체육복을 도난당한 학생들의 번호가 담긴 배열 lost, 여벌의 체육복을 가져온 학생들의 번호가 담긴 배열 reserve가 매개변수로 주어질 때, 체육수업을 들을 수 있는 학생의 최댓값을 return 하도록 solution..

완주하지 못한 선수 문제 설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 participant의 길이보다 1 작습니다. 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다. 참가자 중에는 동명이인이 있을 수 있습니다. 입출력 예 participant completion return [..