공대생

1. Login.ejs 이전 포스트에 이어서 Login.ejs 코드는 다음과 같다. 이제 사용자가 로그인을 하기 위한 껍데기를 모두 구현하였으니 사용자가 입력한 아이디와 비밀번호를 받아와서 처리하는 과정을 구현할 차례이다. 로그인 Not registered? Create an account 이 코드에서 아랫부분에 다음과 같이 login.js 파일을 연동한다. login.js 파일은 사용자가 껍데기에 아이디와 비밀번호를 입력하면 해당 문자열을 코드로 받아오는 역할을 한다. 이 ejs코드가 실행되면 login.js도 실행되어 사용자의 아이디와 비밀번호를 받아올 수 있게 되는 것이다. 입력받을 부분에 위와 같이 id를 지정하여 처리한다. 2. js/home의 login.js "use strict"; //htm..

내가 만들어야 하는 웹페이지 기능은 상품검색, 상세정보, 체크리스트, 로그인, 회원가입 이다. 이에 관한 코드들을 모두 index.js 파일에 넣으면 코드가 너무 길어져 가독성이 떨어지게 된다. 따라서 모듈화가 필요하다. 이때 라우터를 만들면 페이지 마다 동작할 코드를 모듈화하여 관리할 수 있다. 또한 웹화면 ejs파일의 경우에는 index.js에서 경로를 지정하여 각 화면코드를 불러올 수 있게 하였다. 1. index.js /* 설치한 express 모듈 불러오기 */ const express = require("express"); // parsing가능 const bodyParser = require("body-parser"); // 환경변수 관리, .env에 DB정보 저장 const dotenv =..

※express란? Node.js를 위한 빠르고 개방적인 간결한 웹 프레임워크로, node.js를 이용해 웹을 개발하려는 개발자들을 위해 서버를 쉽게 구성할 수 있도록 만든 프레임워크이다. 1. express 설치하기 npm install express --save VScode의 cmd창에서 위의 명령어를 입력해 express를 설치한다. 2. index.js /* 설치한 express 모듈 불러오기 */ const express = require("express"); // parsing가능 const bodyParser = require("body-parser"); // 환경변수 관리, .env파일에 DB정보 저장 const dotenv = require("dotenv"); dotenv.config()..

FrontEnd 1. index.js const userRouter = require('./src/routes/home/user'); //user.js 파일에 있는 라우터들을 가져옴 //템플릿 엔진 ejs 사용 app.set('views', __dirname + '/src/views'); app.set('view engine', 'ejs'); app.use('/user', userRouter) //userRouter 사용 2. user.js (get) var express = require('express'); var router = express.Router(); //ctrl 받아오기 const ctrl = require("./home.ctrl"); router.get('/login', ctrl.out..

코드를 수정할 에디터로 VScode를 설치하고 아래 링크에서 Node.js의 LTS버전을 설치했다. https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 설치 후 cmd창에 들어가 다음과 같이 node와 npm의 버전을 확인할 수 있다면 설치가 제대로 완료된 것이다. 그런데 VScode에서 express를 설치하고 >node index.js 로 서버를 실행시키려고 하니 다음과 같은 오류가 떴다. node : 'node' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이름이..

한이음 프로젝트를 마치고 프로젝트의 마무리로 웹페이지를 제작하기로 했다. 한이음때는 앱으로 우리 프로젝트를 구현해 보여줬는데, 프로젝트 확장의 일환으로 카트에 디스플레이를 부착할 경우 앱과 동일한 화면을 보여주기 위한 웹페이지를 제작하는 것이 목표이다. 내가 개발을 맡은 부분은 로그인, 회원가입, 상품검색, 체크리스트 기능이다. 더보기 백엔드는 node.js를 사용하고 프론트엔드는 컴퓨팅엔진 ejs를 사용하기로 결정했다.