분류 전체보기 210

node>서버와 유저가 통신하는 법 / RESTful API

글작성기능을 만들어볼건데 그 전에 개념설명을 하나하고 지나가야합니다.  1. 서버가 뭐냐면 강의 맨 처음에 쉽게 설명했는데서버는 그냥 요청이 들어오면 그걸 처리해주는 간단한 프로그램입니다.누가 웹툰달라고 하면 웹툰보내주고DB데이터 달라고하면 DB데이터 보내주는 프로그램일 뿐임반대로 DB에 데이터좀 저장해달라고 하면 데이터 저장해주는 것도 가능합니다.아무튼 서버는 누가 뭔가를 요청하면 그걸 처리해주는 프로그램일 뿐인데    2. 예의바르게 요청해야함 유저 마음대로 대충 서버에게 요청하면 서버는 데이터를 보내주지 않습니다.유저가 서버에게 뭔가 요청하려면 1. method 2. URL을 정확히 적어서 보내야합니다    method는 이런 것들이 있는데 이 중에서 마음에 드는거 하나 고르면 됩니다.GET은 서버..

Node.js 2024.07.25

node>웹페이지에 DB데이터 꽂기 (EJS, 서버사이드 렌더링)

저번시간에 DB에서 출력한 글제목을 유저에게 보내주는건 성공했는데 근데 데이터만 달랑 보내면 되겠습니까멋진 글목록페이지를 html로 하나 만들어서  그 안에 글제목들을 박아넣어서 유저에게 그 html  페이지를 보내보도록 합시다.  근데 그러려면 html안에 데이터를 꽂아넣는 법을 알아야하는데 그건 템플릿 엔진이라는걸 쓰면 가능합니다.그거쓰면 html 안에다가 서버에 있던 데이터들을 막 꽂아줄 수가 있습니다 템플릿엔진은 여러가지중에 고를 수가 있는데 우리는 이 중에서 가장 쉽고 간단한 ejs를 써볼 것입니다. 다른 템플릿엔진들은 새로운 문법 많이 익혀야되는데 이건 딱히 새로운 문법 익힐 필요없이 자바스크립트 문법그대로 사용할 수 있음     ejs 셋팅 템플릿엔진을 쓰려면터미널 열어서 npm instal..

Node.js 2024.07.25

node>MongoDB에서 데이터 출력하기 (array/object 문법)

DB에 게시물 한 두개만 저장해보도록 합시다.- mongodb.com 사이트 들어가서- collection 버튼 누르면현재 DB에 저장된 데이터들을 구경해볼 수 있는데저번시간에 forum이라는 데이터베이스안에 post 라는 컬렉션 (폴더)를 만들어봤습니다.  이제 심심하니까 여기다가 데이터 몇개만 저장해볼건데 게시판을 만든다고 했으니까 유저 게시물을 post 컬렉션에 임시로 몇개 만들어봅시다. insert document 버튼이 어딘가 있을텐데 누르면 데이터를 저장할 수 있습니다.  title : '어쩌구'content : '저쩌구' 이런 형식으로 대충 유저 게시물을 두어개 정도 저장해보도록 합시다. document에는 데이터이름 : 데이터값 형식으로 데이터를 저장할 수 있습니다. 자바스크립트 objec..

Node.js 2024.07.25

node>MongoDB와 서버 연결하려면

DB에 글을 저장할 준비가 다 된 것 같은데 DB에 데이터 입출력은 누가합니까?유저가 직접 글을 DB에 집어넣고 그러면 편할거같은데 그렇게 해버리면 3일 후에 금방 서비스 종료하는 것입니다. 유저에게 다이렉트로 DB 입출력 권한을 주면유저가 DB에 이상한 짓을 하면 큰일나기 때문에중간에 검열하는 친구가 하나 필요합니다.   중간에서 이거저거 검사하는 역할은 서버가 담당합니다. 예를 들어 글을 하나 DB에 저장하고 싶으면 1. 유저가 서버로 게시물을 보내고 2. 서버는 그걸 검열해본 후 DB에 저장시켜주면 됩니다.오늘은 서버가 DB와 통신하는 법을 좀 알아보도록 합시다.      서버와 MongoDB 연결 서버 프로젝트에서 mongodb를 연결하고 싶으면 일단 mongodb 라이브러리를 설치합시다.  np..

Node.js 2024.07.25

node.js>MongoDB 호스팅받고 셋팅하기

1. 구글에 Mongodb atlas 라고 검색해서 들어가거나 mongodb.com 홈페이지를 방문합니다.  2. 가입합니다. 아마 메일인증 필요  ▼ 3. 가입시 뭐 채우라고 하면 잘 채워봅니다      ▼ 4. 무료 티어를 선택해서 서버위치도 선택합니다. 한국 유저들에게 빠른 서비스 제공하려면 서울을 선택합시다.        ▼ 5. 좌측 Database Access 메뉴에서 DB 접속용 아이디/비번을 생성합니다.데이터베이스 접속할 수 있는 아이디/비번을 새로 만들어주는겁니다.왜냐면 하나의 데이터베이스를 여러사람이 사용할 수도 있으니까요.  아주 안전해보이는 admin/qwer1234 이런 아이디 비번은 어떨까요 아무튼 만들고 잘 기억해두십시오.    ▲ 주의점은 역할을 atlas admin으로 설정..

Node.js 2024.07.25

node.js>웹페이지에 디자인 넣으려면

이쯤되면 귀찮은 점이 하나 있을텐데  소스코드를 수정했을 경우 ctrl + c 눌러서 터미널에 실행하던걸 끄고 다시 node server.js를 입력해야 수정사항을 미리볼 수 있습니다. 매번 입력하는게 귀찮으면 nodemon 사용하면 됩니다. 터미널 열어서 실행되고있던거 ctrl + c 눌러서 끄고  npm install -g nodemon 입력해서 설치해봅시다.  그럼 이제 서버파일을 띄울 때 node말고 nodemon server.js 이렇게 입력해둘 수 있는데그러면 소스코드를 변경 후 파일저장하면 얘가 알아서 서버도 재시작해줍니다. 이제 코드짜고 저장만 하면 끝임      static파일 (css파일) 첨부하기 html에 디자인을 넣고 싶으면 css 파일에 작성하는게 일반적인데 css 파일 하나 만..

Node.js 2024.07.25

node.js>웹페이지 보내주려면 (라우팅)

저번시간에 서버를 간단하게 만들어봤습니다.근데 메인페이지 하나만 만들어봤는데 이번엔 여러 페이지를 더 만들고 싶으면 어떻게할지 알아봅시다.   근데 만들기 전에 실제 사이트들은 어떤 식으로 여러가지 페이지들을 만들어놨는지 구경부터 해봅시다. 예를 들어 네이버 웹툰같은 사이트 방문해보면 comic.naver.com여기로 접속하면 메인페이지가 보이긴 하는데 URL 뒤에다가 /webtoon 을 붙여서 접속하면 오늘의 웹툰 페이지 보여주고URL 뒤에다가 /challenge 를 붙여서 접속하면 도전만화 페이지를 보여줍니다.  네이버 웹툰 말고도 다른 사이트도 이런 방식으로 페이지를 나눠놓는데우리도 그렇게 만들면 될 것 같습니다. 주소창에 입력하는 URL을 기반으로 각각 다른 페이지를 보내줍시다.      새로운 ..

Node.js 2024.07.25

Node.js> Node.js, Express 설치와 셋팅

개발환경 셋팅 개발환경 셋팅부터 해보도록 합시다. 요즘은 맥북이나 윈도우나 별 차이없음   1. nodejs 구글에 검색하면 맨처음에 뜨는 사이트가 있을텐데 거기서 LTS 버전 다운받아서 설치까지 합시다. - 설치할 때 경로같은건 안만지는게 좋을 수도 있습니다. - 윈도우는 chocolatey 같은거 설치안해도 됩니다.    2. 에디터가 하나 필요한데 VSCode 에디터 구글에 검색해서 설치합시다.      프로젝트 생성은  1. 코드짤 작업용 폴더를 하나 만들고VSCode 에디터 켜서 상단 file - open folder 눌러서 에디터로 작업용 폴더를 오픈합시다.    2. server.js 파일을 하나 만들어줍시다. 거기다가 서버코드짤 것임   3. 에디터 상단 terminal 눌러서 터미널을 열..

Node.js 2024.07.25

git>git stash로 코드 잠깐 보관하기

방금 쓰레기같이 짜놓은 코드가 있다고 칩시다. 그 코드를 잠깐 치워놓고 개발하고 싶으면 주석처리해도 되겠지만 git stash 명령어를 이용해도 잠깐 코드를 치울 수 있습니다.      git stash 사용해서 코드 잠깐 다른 곳에 보관하기 aaaaaaaaaaaaa파일 하나 만들어서 이렇게 코드를 짜서 commit 해봅시다.   aaaaaaaaaaaaabbbbbbbbbb그리고 밑에 bbbbb어쩌구 코드를 짜놨다고 칩시다.근데 밑에 코드가 마음에 안드는겁니다.이걸 잠깐 삭제해버리고 싶으면 git stash 명령어를 씁시다.       git stash터미널에 git stash 입력하면 방금 작성한 bbbb 어쩌구 코드는 잠깐 다른 공간에 보관됩니다. (그래서 파일들이 최근 commit 상태로 되돌아갑니다..

Git 2024.07.24

git> git flow / trunk-based 브랜치 전략

개발자 10명이서 브랜치를 대충 아무렇게나 만들면 개발과정이 매우 복잡해지고 추적도 어려워서git branch 깔끔하게 만들도록 도와주는 방법론같은게 있습니다. git flow, github flow, gitlab flow, trunk-based 등 다양한 것들이 있습니다.   이런걸 적용하면1. 브랜치관리가 쉬워지고 2. 팀원이 아무리 많아도 개발절차가 매끄러워집니다. 그래서 프로젝트 리드하는 사람들이 알면 좋습니다. 시키는 것만 하는 코딩노예들은 몰라도 됩니다.    안정적인 운영이 필요하면 git flow  님들이 만드는 프로그램이 항상 안정적인 release를 해야한다면 (예를 들면 게임개발)git flow 전략을 쓰면 됩니다.  git flow 전략은 크게 5개 브랜치를 운영하는데 - main ..

Git 2024.07.24