클라이언트에서 서버로 파일을 전송하는 방법을 알아보았다.input 태그- type = "file"로 지정- name = "서버에서 파일을 인식할 이름"name으로 이름을 지정하면, 서버에서는 이 이름으로 데이터를 얻는다는 것이다.예) upload.single("userfile")로 설정해야 한다.일반 form 전송 - form 태그 업로드- action = "서버에 보낼 경로"- enctype = "multipart/form-data"로 반드시 설정해야 한다.multer는 multipart(multipart/form-data)가 아닌 폼에서는 동작하지 않는다.body-parser데이터를 쉽게 처리할 수 있도록 도와주는 라이브러리사용 목적: post로 정보를 전송할 때 요청의..

1주차 수업에서 배운 CSS 작성법과 선택자 종류들에 대해서 정리하고자 한다.CSS 작성법CSS는 HTML 요소의 style을 정의해야 하므로, 스타일을 적용하고자 하는 HTML 요소를 선택할 수 있어야 한다.- 선택자(Selector): 스타일을 적용하고자 하는 HTML 요소를 선택하기 위해 CSS에서 제공하는 수단선택자로 HTML 요소를 선택하고 {} 내에 속성 값을 지정하여 다양한 style을 정의한다.- 속성(Property)여러 개의 속성을 연속해서 지정할 수 있으며, 세미콜론";"으로 구분한다. 속성은 표준 스펙으로 이미 지정되어 있는 것을 사용해야 한다. 사용자가 임의로 정의할 수 없다.- 값(Value): 해당 속성에 사용할 수 있는 값을 키워드, 크기 단위, 색상 단위 등의 특정 단위로 ..

모듈(Module)특정한 기능을 하는 함수나 변수들의 집합재사용 가능한 코드 조각장점코드 추상화코드 캡슐화코드 재사용의존성 관리모듈은 module.exports 또는 exports 객체를 통해 정의하고 외부로 공개한다.공개된 모듈은 require 함수를 사용하여 import 한다.모듈 만들기하나의 모듈 파일에 하나 만들기// func.jsfunction connect() { return a + b;}module.exports = connect;module.exports에는 하나의 값(원시 타입, 함수, 객체)을 할당할 수 있다.하나의 모듈 파일에 여러 개 만들기// var.jsconst a = "a 변수";const b = "b 변수";module.exports = { a, b};export와 expor..

CSS(Cascading Style Sheet)웹 페이지를 디자인하기 위해 사용하는 언어CSS 참조 방식인라인 방식요소의 style 속성에 직접 스타일을 작성하는 방식디자인을 적용하기 위해 각 태그마다 style 속성을 적어줘야 하기 때문에, 같은 스타일을 가진 태그를 사용하려고 해도 따로 작성해줘야 한다. 즉, 재사용이 불가능하기 때문에 추천하지 않는 방식이다.내장 방식의 내용(Contents)으로 스타일을 작성하는 방식HTML의 태그 내부에 태그를 선언하여 각 태그에 적용할 스타일을 작성한다. 인라인 방식에 비해 재사용성은 높아졌지만, 코드의 길이가 굉장히 길어지기 때문에 추천하지 않는 방식이다. HTML과 CSS의 전체 코드량이 많지 않고 CSS가 해당 HTML 문서에서만 적용될 경우 유용하게 ..

Node.js Node.js는 구글 크롬의 자바스크립트 엔진(V8 Engine)에 기반해 만들어진 Javascript 런타임 환경이다. 여기서, 런타임이란 프로그래밍 언어가 구동되는 환경을 말한다. Javascript의 런타임 환경은 웹 브라우저에만 존재했었다. 이러한 Javascript를 서버단 언어로 사용하기 위해 나온 것이 Node.js이다. Mac에서 Node.js 설치하기 brew install node 버전 확인 node -v npm -v npm Javascript로 개발된 각종 모듈의 설치, 업데이트, 구성, 제거 과정을 자동화하여 관리해주는 기능 npm 사용하기 npm init 프로젝트 시작할 때 사용하는 명령어이다. package.json에 기록될 내용을 문답식으로 입력한다. npm in..

HTML의 기본적인 구조와 HTML에서 사용하는 태그들에 대해서 배우는 시간을 가졌다.HTML의 구조 태그웹 페이지를 구성하는 모든 요소들을 포함한다. 태그HTML 문서의 메타 데이터(데이터에 대한 정보를 제공하는 데이터)와 문서 정보를 정의하는 데 사용되는 태그title: HTML 문서의 제목style: HTML 문서의 Style 정보 정의link: 외부 리소스와의 연결 정보 정의, CSS 파일 연계에 사용script: Javascript 입력meta: 페이지 설명, 키워드, 저자, 화면 크기 등의 정보. 주로 브라우저 또는 검색 엔진에서 사용 태그HTML 문서의 실제 콘텐츠를 정의하는 데 사용되는 태그 태그 안에 다양한 태그를 사용하여 웹 페이지의 구조를 설계할 수 있다.태그의 종류태그설명 속..

기본적인 개발 환경 세팅을 진행했다.Mac OS에 Git 설치Mac OS에 Git을 설치할 때 Homebrew를 사용하기 때문에, Mac OS를 사용하고 있는 경우 Homebrew 설치도 필요하다.- HomebrewMacOS 운영체제에서 사용되는 오픈 소스 패키지 관리자홈브루를 사용하면 터미널을 통해 손쉽게 다양한 소프트웨어 패키지를 설치, 업데이트 및 관리할 수 있다. Git의 설치 여부를 확인하고 싶다면,git --versionGithub Repository 생성git config --global init.defaultBranch maingit config --global user.name "사용자 이름"git config --global user.email "사용자 이메일"git config --g..