어쨌든 해내는 코딩 일기

css 파일에서 width :80% 입력하면 왼쪽부터 80임. #main{ background-color: whitesmoke; width: 80%;}  bootstrap에서 margin 검색m은 margin이고 x로 left and right 조절, auto로중앙으로 -> main에 클래스 만들기맨 마지막 줄 main 옆에 class="mx-auto" 입력 bootstrap에서 image검색fluid가 붙으면 이미지를 감싸고 있는 div 태그의 크기를 따라감.container는 12등분이고, img 위에 div.col-6을 입력해서 div태그로 img 감싼다.항상 img는 6/12가 되도록 fluid 할 것임.지금까지 결과알게된 점: class 만들고 싶으면  div.이름..

https://getbootstrap.com/ BootstrapPowerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize prebuilt grid system and components, and bring projects to life with powerful JavaScript plugins.getbootstrap.com 부트 스트랩 사용 이유: 모바일, pc 모두 적용되는 반응형 웹사이트 제작 위해 1)read the docs 클릭2)css 부분을 긁어서 head에 넣어주기이런식으로 이미 짜여진 코드를 자유자재로 이용할 수 있어서 시간을 아낄 수 있음! 3) button을 입력한 다음 ..

최종본   https://twelvelovetype.netlify.app/ 십이간지 연애유형십이간지로 알아보는 연애유형twelvelovetype.netlify.app소스 모음https://github.com/nani6765/MyMBTI GitHub - nani6765/MyMBTIContribute to nani6765/MyMBTI development by creating an account on GitHub.github.com 필요한 method 및 함수 (HTML, CSS, JavaScript)페이지 레이아웃; 한 페이지 코드에 main, qna, result 다 들어가있어야 함.

vs code에서 html 여는 방법1) extension에 가서 open in browser을 install 한다2).html 파일을 오른쪽 버튼으로 누르고 open in default browser을 클릭한다. (alt+b)  vs code에서 html  기본 세팅, 자동완성 하는 방법! + enter 또는 html:5 입력  section id 쉽게 입력하는 방법  section#이름   - section#main -section#qna-section#result 입력한 결과

-클라이언트에서 정보를 쳐서 보내주면은 서버(ex.index.js)에서 처리하는데 이때, body-parser dependency 꼭 필요! (npm install body-parser --save 입력)★ 1)https://www.postman.com/downloads/ Download Postman | Get Started for FreeTry Postman for free! Join 35 million developers who rely on Postman, the collaboration platform for API development. Create better APIs—faster.www.postman.com 2) register를 위한 route 코드 입력// 회원 가입을 위한 routea..

GIT은 툴이라면 GITHUB는 이를 이용하는 서비스(클라우드)github 연결하는 방법1. github 회원가입https://github.com/ GitHub · Build and ship software on a single, collaborative platformJoin the world's most widely adopted, AI-powered developer platform where millions of developers, businesses, and the largest open source community build software that advances humanity.github.com  2. 'create repository' 클릭3. 하지만 내 컴퓨터와 github 서버가..

GIT 정의- 어떤 사람은 상품, 어떤 사람은 유저에 대한 코딩을 했다면 그것을 한 번에 합치는 것- 누가 어떤 파트를 맡아서 했는지 확인하는 역할1번) git 저장소를 만들어야하므로 루트 디렉토리 파일(index.js)에 terminal 키고 git init 입력이유:버전 관리를 해야하므로 ! 2번)git status  입력해서 상태 확인하기 Git의 위계 1. working directory git add 를 terminal에 입력하면 모~든 파일들이 스테이징 공간으로 올려보냄.2. staging area하지만 node나 .json에 있는 라이브러리는 terminal에 npm install 하면 그것들만 따로 다운 받을 수 있음.ex1) .gitignore 파일 만들고 안에 node_modules 입..

유저 데이터를 저장하고 사용하기 위한 user model, user schema 만들어야 함. 이 때, schema를 model이 감싼다 ★   1) writer : 작성한 사람2) title: 예를 들면, ' 이 제품 좋아요' 이런 문자열. 길이는 50까지 온다. 예시)const mongoose = require('mongoose');const userSchema = mongoose.Schema({ name:{ type: String, maxlength:50 }, email:{ type:String, trim:true, // space 없애주는 역할 unique:1 }, password:{ ..

https://cloud.mongodb.com/v2#/org/6741951615d0a0648f9ed0ed/projects  Cloud: MongoDB Cloud account.mongodb.com1번)1. 클러스터 클릭2. 클러스터 이름 적기 (나는 newlifecode)3. 무료 버전으로 클릭4. username과 password를 입력한다 (newlifecode, 숫자4)5.create database user를 누른다6. choose a connection method를 누른다7. 나는 여기서 mongodb for vs code를 눌렀다8. 그리고 뜨는 링크를 복사해서 vs code에 입력해놓는다(추후에 쓸 예정)2번)- terminal에 npm install moongoose -- save를 입력..

1번) terminal에 node- v 입력해서 버전 뜨는지 확인-terminal에 cd documents  입력해서 '문서'파일에 들어가기- mkdir (폴더명) 입력해서 '폴더명' 폴더 만들기- cd 폴더명 입력해서 '폴더명' 폴더에 들어가기2번) npm 패키지 만들기 위해서 npm init 입력- 엔터 엔터 누르면서 넘어가고 폴더명 불러오기3번) package.json 생성되어 있음. 4번) index.js라는 파일 만들기5번) terminal에 npm install express -- save 입력해서 node js의 프레임워크인 express js 다운로드 받기- package.json에서 express 확인 가능6번) 위 과정을 하면 알아서 생기는 node_modules 마지막 단계 링크htt..