반응형

전체보기 148

[Back End] Automatically updating with nodemon

지금까지 코드가 수정될때마다 메뉴얼로 서버를 정지 시켰다가 다시 시작해야 했습니다. 그 번거러움을 덜기 위해 Nodemon을 사용하겠습니다. Nodemon을 사용하기 위해서는 다음과 같은 명령어로 설치를 해줍니다. 여기서 실제 production이 아닌 dev환경의 package를 따로 사용할것이라고 지정합니다. npm install nodemon --save-dev 설치과 완료되면 이제부터는 node명령어가 아닌 아래와 같은 명령어로 서버를 시작할수 있습니다. npx nodemon src/server.js 이제 이 명령어를 통해서 서버가 지속적으로 실행 되고 소스가 업데이트될때마다 자동으로 서버를 새로 고치고 다시 시작합니다. 소스를 수정하고 저장 하게 되면 아래와 같은 메세지를 뿌리고 서버를 자동으로..

[Back End] Upvoting articles

블로그 페이지에 "좋아요" 를 표시해 보겠습니다. 현재는 DB에 글들이 연결되어 있지 않고 메모리에서 작동하는 방식으로 먼저 구현을 하고 나중에 DB와 연결하는 과정을 다시 해보겠습니다. Upvoting 즉 좋아요를 구현하기 위해서 PUT request를 사용합니다. 코드는 아래와 같습니다. server.js import express from 'express'; // Use temporary let articlesInfo = [{ name: 'learn-react', upvotes: 0, }, { name: 'learn-node', upvotes: 0, }, { name: 'mongodb', upvotes: 0, }] const app = express(); app.use(express.json()) ..

[개발] Agile 과Jira 개요

Agile 개요 overview Agile 이란? What is agile? 작업 계획을 짧은 단위로 세우고 제품을 만들어 나가는 사이클을 반복함으로써 고객의 요구 변화나 회사의 방침에 유연하고도 신속하게 대응하는 방법론입니다. 작업을 완료하는 방법 - A way of getting things done 프로젝트 관리에 대한 경험적 접근 방식 - An empirical approach to project management 즉, 프로젝트 관리에 과학적 또는 데이터 기반 접근 방식을 사용합니다. Agile을 사용하면 계획, 프로세스 및 제품을 지속적으로 개발할수 있습니다. (Continuously develop the plan, process and product) 이것은 프로세스와 계획을 미리 개발한 다..

PROGRAMING 2024.03.14

[대학] 미국 대학 장학금 검색

미국은 장학금을 장려하는 나라입니다. 미국 대학들은 훌륭한 인재를 배출하기 위해서 비용 대비 학비가 적어도 예전에 기부를 받아 놓은 발전 기금등을 통해서 충당하고 있습니다. 어떤 조사에 따르면 신청 조차 하지 않는 장학금이 많다는 조사가 있을 정도입니다. 여기에 소개되는 검색 사이트는 주로 보통 대학에서 제공하는 Need-Based와 달리 성적등에 따른 Merit-Based를 제공됩니다. 하지만 장학금이 대부분 메릿베이스로 제공된다고 해서 무조건 학교 성적만으로 선정되는 것은 아닙니다. 특히 고려해야 할 것은 성공한 수많은 사람들이 만들어 놓은 장학금이 무척 많다는 것입니다. 이들은 성적말고도 여러가지 다양한 기준의 우수 학생을 뽑습니다. 다시 말해서 장학금을 받기 위해 반드시 학년에서 1등을 하거나 스..

다른것/대학 2024.03.13

[대학] 미국 대학 장학금 Merit-Based Need-Based

미국대학 장학금의 형태 1. Merit-Based AID (메릿 베이스) 성적우수자나 체육 특기생등 재능을 가진 학생에게 무료로 주는 장학금입니다. 대학측이 학생 가정의 재정상태와 관계없이 주는 장학금으로 보통 한국에서 일반적으로 통용되고 있는 장학금이라는 의미입니다. 보통은 신청을 안해도 받을수 있으면 대학에따라 금액은 천차 만별이고 그 혜택 범위가 넓지는 않습니다. 자세한 내용은 각 대학을 통해 확인해야 합니다. 2. Need-Based AID (니드 베이스) 연방 정부, 주정부 및 대학이 대학 학자금 지원을 위해 마련한 계산 법에 의해 학생과 부모의 수입과 자산, 가정환경, 대학에 다니는 자녀수등을 근거로 지원해주는 장학금입니다. 신청을 하게 되면 입시에 불이익을 받는 학교도 있습니다. 입학 전에 ..

다른것/대학 2024.03.13

[Back End] URL parameters in Express

URL parameter에 의한 매개 변수 전달. Get Request를 통해 매개 변수를 전달 하는 방법은 다음과 같습니다. 우선 아래와 같이 Get Method를 추가합니다. server.js import express from 'express'; const app = express(); app.use(express.json()) app.post('/hello', (req, res) => { res.send(`Hello! ${req.body.name}!`); }); app.get('/hello/:name', (req, res) => { //const name = req.params.name; const { name } = req.params; // object destructuring for litt..

[Back End] Post request with JSON data

Post 요청으로 데이터 표시 간단하게 Json 개체 형식의 데이터를 Post 요청으로 서버측에서 처리하는 방법을 구현해 봅니다. 다음과 같이 server.js파일을 변경합니다. server.js import express from 'express'; const app = express(); app.use(express.json()) app.post('/hello', (req, res) => { res.send(`Hello! ${req.body.name}!`); }); app.listen(8000, () => { console.log('Server is listening on port 8000'); }); 아직은 자동으로 Express 서버가 다시 시작하지 않으므로 서버코드가 수정될때마다 서버를 정지시키..

[Back End] Testing an Express server with Postman

Postman을 이용한 Express 서버 테스트. 간단한 서버를 구축하였고 지금은 구축한 Express서버를 테스트할 방법을 알아봅니다. Postman 프로그램은 서버를 구축할때 서버를 테스트하는데 매우 유용한 프로그램입니다. postman.com/downloads로 가서 소프트웨어를 다운로드 한후 설치를 합니다. 설치가 완료되면 다음과 같이 현재의 localhost:8000/hello에 Get 메소드를 통해 테스트를 합니다. 이 블로그에 사용될 request를 간단하게 살펴보면, GET request: 일반적으로 컨텐츠내용이나 사용자 정보 및 게시물 정보를 서버에 요청하는데 사용됩니다. POST request : 일반적으로 서버에 새로운 리소스를 만드는데 사용됩니다. PUT request: 알반적으로..

[Back End] Setting up an Express server

Express 서버 설정하기. 서버사이드를 구성하기 위해서 Express server에서 Node.js를 이용하여 서버측을 구성하도록 합니다. 지금까지 이용한 클라이언트측 Front End 폴더에서 벗어나 새로운 Back End 폴더를 생성해서 그곳에서 서버측 프로젝트를 완성하도록 하겠습니다. 그러기 위해서 Terminal에서 새로운 폴더를 구성하여 Back End 프로젝트를 생성합니다. 명령어는 아래와 같습니다. 새로운 VS Code 프로젝트 창이 열립니다. 그곳에서 이제부터 Back End 작업을 합니다. 먼저 NPM 패키지를 초기화합니다. 명령어는 다음과 같습니다. npm init -y package.json파일이 생성되고 이제 Express를 설치합니다. 명령어는 다음과 같습니다. npm inst..

[Front End] Creating a 404 page

404 페이지 지정. 이번에는 잘못된 URL로 접속했을경우 페이지를 찾을수 없다는 메세지를 내도록 하겠습니다. NotFoundPage.js const NotFoundPage = () => ( 404: Page Not Found! 404: 페이지를 찾을수 없습니다! ); export default NotFoundPage; App.js import './App.css'; import { BrowserRouter, Routes, Route } from 'react-router-dom'; import NavBar from './NavBar'; import HomePage from './pages/HomePage'; import AboutPage from './pages/AboutPage'; import Aric..

반응형