1. basic //basic setup const express=require('express'); const bodyParser = require('body-parser'); const app = express(); app.get("/",function(req, res){ //send sth back to the browser as a response res.send("Hello"); }); app.listen(3000,function(){ console.log("Server started on port 3000"); }) 2. templating : We're using ejs -after installing ejs in terminal, add these to the basic js codes a..
when you click the button "try again" -it triggers a post request to "/failure" (written in failure.html) -that is gonna be called to our server(app.js) and it redirects to "/" -that sends us to "/signup.html" to be rendered on screen renting server to access others to my page *HEROKU inside the project file, add "Procfile", not txt, just this inside, type web: node app.js //telling heroku how t..
git file - making savepoints, can roll back to other versions git add filename.txt //adding one by one git add . //everything inside the current directory is added to the staging area *working directory folder/directory where you initialize your git repository -$ git init *staging area -$ git add (working dir => staging area) pushing selected new file(s) into staging area putting files that you ..
set up how-to *in terminal 1. change directory into a location where we want to create our new project & create files (cd, mkdir, touch) 2. initialize our npm (npm init) 3. installing npm modules (npm install moduleName here, we'll install express, body-parser) *in atom (Atom . =>open current dir in atom) 4. require installed modules (require) 5. set up our server to listen on port (app.listen) ..
one of the most popular javascript library. makes much shorter codes how to use document.querySelector("h1") //in javascript = jQuery("h1") = $("h1") javascript 파일의 링크 위에 있어야 하며, 둘다 body 끝나기 직전에 위치시키기! $("h1") = document.querySelectorAll("button"); no syntax diff between plural and single property single property in it: getting the value of it $("h1").css("color"); two properties: setting the va..
EventTarget.addEventListener(); sets up a function to be called whenever the specified event is delivered to the target target is an obj which an event is calling the method addEventListener(type, listener[ , options]); addEventListener(eventName, respondToEvent); addEventListener(type, listener[ , useCapture]); type: event type th listen for listener: usually javascript function. called when th..
javascript 적용 style 적용시키는 것과 같이, inline, style, external 방식 사용하여 적용시킬 수 있음 onload : 해당 부분이 loaded up 될 때, " "안이 carried out 혹시 따옴표 안에 따옴표를 써야 할 때(구분필요), ' '를 사용해서 구분되도록! //body가 loaded up 될 때 alert 창 띄우도록 internal javacript : script 태그 사용 위에서부터 읽다가 해당 부분이 나오면, 자바스크립트에 쓰인 대로 하는것 external js styles.css처럼 외부 js파일의 경로를 명시 css는 head에 파일 경로를 명시하지 않으면 명시된 곳 위까지 기본적인 css형식을 따르기때문에 가장 위(head 태그가 끝나기 전)에 ..
alt+ 드래그를 통해 복수의 줄의 같은 위치에 같은 내용을 작성 가능 복붙보다 더 편하게 가능하다! Carousel 슬라이드 쇼 처럼, 여러 content에 접근 가능하게 함 *bootstrap v4.5 기준 Previous Next slide 부분 data-ride: false( autoplay x) / carousel: 자동재생 carousel-inner 안에 슬라이드 쇼들 넣으면 됨 carousel-item이 하나의 슬라이드 쇼. 그 옆에 active 있는 게 가장 처음으로 뜸 button 부분 prev/next로 전후 버튼 구분 href로 슬라이드 쇼의 아이디(여기서는 testimonial-carousel) 연결. 어디에 영향을 끼치는지 알려주는 부분 role="button"을 추가해 줌으로써 ..
alert("message"); => message라는 내용을 가진 경고창 띄움 typeof(변수); =>타입 반환 prompt("message"); => input 받을 수 있는 창이 뜸 변수를 설정f하지 않았으므로 따로 저장되지x 변수명에는 숫자, 영어, _, $만 가능(숫자로 시작 불가) 변수명.length => 글자수 반환 변수.slice(startNum,endNum); ->끝 숫자 전까지 포함. slice(5,); ->하면 인덱스 5부터 끝까지! alert(prompt("Input texts below").slice(0,141)); 변수명.toUpperCase(); ->모두 대문자로(반환할뿐, 원본 수정x) 계산(+ - * / %)=> /는 파이썬과 같이 정확한 나눗셈, %는 나머지 ++,-- ..
프론트엔드와 백엔드 front-end: 유저가 보는 쪽 javascript, css, html, bootstrap back-end: 그 뒤 기능구현, 데이터베이스.. .NET, Ruby, PHP, NodeJS, Java, SQL what is bootstrap responsive=> adaptable layout. changes its layout depending where its being displayed 이미 정의된 클래스들을 이용하여 편하게 styling 가능 : div와 비슷한데 navigation bar와 관련된 것. row, col을 사용하여 나눌 수 있음 col 화면 전체를 하나의 column의 width로 사용 하나의 row에 여러 column을 할당함으로써 동일하게 나눌 수 있음 co..
