본문 바로가기

728x90
반응형

전체

(39)
[JS] Primitive Type 과 Reference Type Variable types primitive type : number, string, boolean, null, undefined, symbol reference type : object, array, function 1. primitive type number, string, boolean, null, undefined, symbol value자체를 메모리에 저장한다. let age = 20; let age2 = age; console.log(age); // 20 console.log(age2); // 20 변수 age와 age2는 각각의 메모리 공간을 가지게 된다. 변수 age2의 메모리 공간에 변수 age의 값을 복사해서 가져오게 된다. age와 age2를 console에 출력해보면 둘 다 20이 ..
[JS] 변수 선언 - var, let, const 비교 변수 선언 3가지 1. let ▶ ES6에 추가된 키워드 ▶ 재선언은 불가능 하지만 재할당은 가능하다 ▶ Read / Write 가능 let name = 'eunji'; console.log(name); // eunji let으로 name이라는 변수를 선언하고 선언함과 동시에 'eunji' 라는 값을 할당한 것이다. 이것을 consle창에 출력해보면 eunji라는 값을 확인할 수 있다. name = 'hello'; console.log(name); // hello 다시 변수 name 에 'hello'라는 값을 할당하면 console창에서 hello로 값이 변경된 것을 확인할 수 있다. 비어져 있는 여러개의 메모리 박스가 있다. 키워드 let 으로 변수를 선언하게 되면 하나의 메모리 박스를 가리키는 포인터..
[JS] <script>의 async 와 defer 속성 이해 Html에서 JavaScript파일을 어떻게 포함하는 것이 더 효율적일까? 웹 브라우저는 html을 parsing하다가 그래서 많이 사용하는 방법이 안 제일 마지막 부분에 를 추가하는 방법이다. 이 경우에는 JS파일을 받기전에 사용자가 빠르게 웹사이트를 컨텐츠를 볼 수 있다. 사용자가 기본적인 html을 빠르게 볼 수는 있지만 웹사이트가 JS에 많이 의존적이고, 동적인 요소가 많다면 사용자가 정상적인 웹사이트를 확인하기까지 여전히 많은 시간이 지연된다. 3. + html을 parsing하다가 를 만나면 파일 다운로드 명령만 내려놓고, 나머지 html을 끝까지 parsing 하게 된다. html parsing이 끝나면 다운받아진 파일을 실행하게 된다. html..
[React] React 디렉토리와 GitHub Repository 연결 1. GitHub에 새로운 Repository 생성 Repository name과 Description을 적고 Create repository 버튼 클릭. 새로운 Repository를 만들면 아래와 같이 나온다. 2. 프로젝트에 Git 저장소 설치 VScode Terminal에 Git 명령어로 소스코드 업로드 >> git init 해당 프로젝트에 git 설치 >> git add . 프로젝트의 파일 변경 사항 추가 >> git commit -m "[ description ]" commit / commit 메세지 작성 >> git initgit remote add origin [ repository 주소 ] 해당 프로젝트에 git 설치프로젝트와 git repository(git의 원격 저장소) 연결 >> g..
[React] React 설치 및 실행 1. npm 설치 nodejs를 설치하면 npm이 함께 설치된다. npm설치방법 : https://designer-ej.tistory.com/3 npm 명령어 >> rmdir [ 폴더명 ] 디렉트로 삭제(디렉트로 안에 파일이 없을 때) >> rmdir /s [ 폴더명 ] 디렉트로 삭제(디렉트로 안에 파일이 있을 때) >> rmdir /s /q [ 폴더명 ] 삭제 여부를 묻지 않음 >> d: or c: 드라이브 간 이동 >> cd.. 상위 폴더로 이동 >> cd [ 디렉토리 경로 ] 다른 디렉토리로 이동 >> dir 현재 디렉토리 목록 확인 2. create-react-app 설치 window command 창에 아래 명령어 입력 >> npx create-react-app [ 프로젝트 이름 ] 작업 폴더 ..
[React] React를 위한 npm 설치 및 사용법 NPM (node package manager) nodejs로 만들어진 앱들의 앱스토어 npm을 이용하여 프로그램을 검색, 설치, 업데이트, 삭제할 수 있다. npm 설치 nodejs를 설치하면 npm이 함께 설치 된다. nodejs.org에서 최신 버전으로 설치한다. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org npm 실행 1. window+R을 누르면 실행 창이 뜬다. 2. 창에 cmd 입력 console창에 node -v를 입력하고 엔터를 쳤을 때 버전이 표시되면 nodejs가 잘 설치 된 것이다. C:\Users\eunji>node -v v15.5.1 console창에 npm -..
[CSS] :root 가상 클래스로 CSS 변수 다루기 Html로 골격을 잡고 CSS로 디자인을 할 때, 폰트 크기나 폰트 컬러 등 여러 부분에 웹페이지의 통일성을 위해서 하나의 같은 변수를 여러 번 사용하는 경우가 많다. 수정을 해야할 때, 요소들을 하나하나 찾아서 수정을 해야 하는데 요소의 수가 많으면 시간이 걸릴 뿐 아니라 정확성도 보장할 수 없다. 이럴 때 :root 가상 클래스를 사용하게 되면 유지보수를 손쉽게 할 수 있다. 그러면 가상 클래스는 무엇이고, :root 가상 클래스는 어떻게 사용하는 것일까? 가상 클래스(pseudo-class)란? Id 선택자나 class 선택자로 사용할 수 없는 요소들을 선택하는 선택 자다. 가상 클래스(pseudo-class)는 요소의 속성 값, 상태, 상대적 위치 등을 이용하여 요소를 선택할 수 있다. Ex) :..

728x90
반응형