전체 글 (60) 썸네일형 리스트형 [ReactJS] npm 명령어 입력시 초기 루트 Url 설정 [ReactJS] npm 명령어 입력시 초기 Root Url 설정 개요 npm으로 서버를 구동시킬 때, 초기 Url을 어떻게 변경하여 접근하도록 할지 알아본다. 목차 소개 배경 변경 방법 변경 결과 위와 같은 방법을 적용한 서비스 소개 1. 소개 배경 서버 구동시 Root Url 변경 배경 npm을 통해 서버를 구동하면, 기본 설정은 root directory('/')로 이동하게 된다. 하지만 실제 배포되어 Client에게 보여지는 서비스 이외에도 다뤄야 하는 resource들이 존재하고 이를 Url을 통해 접속하며 관리 할 수 있기 때문에, 이를 위해 서버 구동 혹은 사이트 접속시 Client에게 제공되는 Url은 앞에 /app이 들어가도록 하기 위해 서비스 접속시 사이트의 Url의 앞에 /app이 항.. [Server] node.js 자동 로그인 구현 (Cookie + Session 활용) [Server] node.js 자동 로그인 구현 (Cookie + Session 활용) 개요 Cookie(쿠키)와 Session(세션)을 통해 자동로그인 로직을 구현해본다. 목차 app.js 설정 자동 로그인 시 Cookie값 설정 및 Session값 설정 구현 Logic 소개 1. app.js 설정 app.js 설정 Client가 로그인 요청을 하면 Server는 요청한 Client와의 Session을 열어준다. app.js this.app.use(cookieParser()); //Cookie 값을 읽기 위한 setting this.app.use( //session을 저장하기 위한 setting session({ secret: process.env.SESSEONKEY, resave: false, //r.. [Server] node.js 비밀번호 초기화 API 구현 [node.js] 비밀번호 초기화 API 구현하기 개요 node.js를 기반으로 비밀번호 초기화 API를 구현한다. 목차 Email 검증 및 Token 생성 Nodemailer module을 통해 비밀번호 초기화 링크 전송 Token 값 검증 및 비밀번호 재설정 소개 1. Email 검증 및 Token 생성 HTML 페이지에서 비밀번호를 재설정 할 Email과 함께 POST 요청 왼쪽의 이메일 전송 버튼을 클릭하여 서버로 POST 요청을 보낸다. Email 검증 및 Token 생성 app.post('/password-reset', function(req, res) { //Database에서 요청받은 Email이 존재하는지 확인 const emailId = await UserStorage.verfiedEm.. [Server] Open API인 KaKao Map을 이용하여 위도 경도 얻기 Open API인 KaKao Map을 이용하여 위도 경도 얻기 개요 Open API인 KaKao Map을 이용하여, 원하는 주소의 위도와 경도 값을 Javascript의 axios를 통해 가져온다. 목차 REST API Key 발급 axios를 통해 위도와 경도 정보 요청 데이터에서 원하는 값인 위도(latitude)와 경도(longtitude) 값 추출 소개 1. REST API Key 발급 Application 등록 및 App Key 발급 ① https://developers.kakao.com/ 로 접속들어간 후 내 애플리케이션을 클릭한다. ② Open API를 사용하고자 하는 Application의 정보를 등록한다. ③ 그 후 애플리케이션에 관한 정보를 입력하여준다. ④ 생성 된 애플리케이션을 클릭.. [Server] Open API인 KaKao Map을 이용하여 위치를 지도에 표시하기 Open API인 KaKao Map을 이용하여 위치를 지도에 표시하기 개요 Open API로 제공되는 KaKao Map을 이용하여, 주어진 위치를 프론트엔드로 나타내어 표시하여준다. 목차 Kakao App Key 발급 html의 Javascript code 입력 구현 화면 소개 1. Kakao Application 등록 및 App Key 발급 Application 등록 및 App Key 발급 ① https://developers.kakao.com/ 로 접속들어간 후 내 애플리케이션을 클릭한다. ② Open API를 사용하고자 하는 Application의 정보를 등록한다. ③ 그 후 애플리케이션에 관한 정보를 입력하여준다. ④ 생성 된 애플리케이션을 클릭 후 요약정보에서 JavaScript Key를 복사하.. [Web Crawling] 전국 대학교 이름 크롤링 하여 DB에 저장하기 -2 전국 대학교 이름을 크롤링 하여 DB에 저장하기 -2 목차 Library 선언 Database와 연결 Cursor 생성 파이썬에서 Query 실행 입력된 데이터를 확인 DB 연결 종료 전체 소스 코드 소개 1. Library 선언 MySQL Library 선언 MySQL과 연동하기 위해 파이썬 모듈중에 하나인 MySQLdb 모듈을 선언하여 준다. import MySQLdb 2. Database와 연결 Database Connect 모듈과 Database를 연결시켜 주기 위해, 파이썬의 MySQLdb 객체를 통해 MySQL과 연결시켜준다. 이 때 각 Parameter는 MySQL을 연결 할 때와 동일한 Parameter 이다. conn = MySQLdb.connect( user="userName", pas.. [Web Crawling] 전국 대학교 이름 크롤링 하여 DB에 저장하기 -1 전국 대학교 이름을 크롤링 하여 DB에 저장하기 -1 개요 Toy Project에서 사용하기 위해 전국의 대학교를 미리 저장하여 DB에 정리하고, 이를 회원가입시에 저장된 DB를 미리 노출 시켜 통일된 양식으로 소속 학교를 받을 수 있도록 나무위키의 전국 대학교가 나와있는 html 페이지를 크롤링 하여 DB에 저장하여본다. 목차 해당하는 페이지의 Robots.txt html page의 tag 목록 파이썬 크롤링 코드 소개 1. 해당하는 페이지의 Robots.txt 나무위키의 Robots.txt 확인하기 나무위키의 대학교가 나와 있는 페이지를 크롤링하기 위해 먼저 나무위키의 robots.txt를 확인해 주어야 한다. 조회하려는 url은 아래와 같다. 이 때 나무위키의 robots.txt는 /w 경로를 Al.. [변수 선언] var vs let vs const 변수 var, let, const 의 차이 개요 Javascript의 실행 컨텍스트에 대해 간단하게 언급하고 호이스팅을 통해 변수의 종류인 var, let, const의 차이를 이해한다. 목차 실행 컨텍스트란? 호이스팅이란? TDZ란? var vs let let vs const 소개 1. 실행 컨텍스트(Excution Context)란? 실행 컨텍스트(Excution Context) 정의 Javascript 엔진은 코드를 실행하기 위해 필요한 몇가지 정보들을 미리 알고 있어야 한다. 그러기 위해 코드를 실행하기 전에 실행 가능한 코드들을 형상화하고 구분하는 추상적 개념이 실행 컨텍스트이다. 풀어서 설명하자면, 코드가 실행가능하기 위해 필요한 환경이라고 할 수 있다. 실행에 필요한 정보 변수 객체(전역변수.. 이전 1 2 3 4 5 6 7 8 다음
