본문 바로가기

반응형

FrontEnd

(65)
#8. 자바스크립트(javascript) - if, ?, switch # 자바스크립트의 if(conditional operators) 와 # if를 조금 더 간단히 사용할 수 있는 삼항 조건 연산자(ternary operator), # switch statement 에 대해서 알아보도록 하겠습니다. # Visual Studio Code 및 Extension 설치 방법
#7. 자바스크립트(javascript) - 논리 연산자(or, and, not) # 이번 장에서는 논리 연산자에 대해 배워보도록 하겠습니다. # Or, And, not, equality 등등 # Visual Studio Code 및 Extension 설치 방법
#6. 자바스크립트(javascript) - 연산자(Operator) :: +, -, /, *, **, %, ++, -- 등 # 오늘은 자바스크립트에서 통용되는 연산자에 대해서 알아보도록 하겠습니다. # +, -, /, *, **, %, ++, -- 등등 # Visual Studio Code 및 Extension 설치 방법
#5. 자바스크립트(javascript) 변수 타입 - single item(number, string, boolean, null, undefined, symbol) # 자바스크립트의 변수 타입에 대해 알아보도록 하겠습니다. # 타입으로는 크게 single item 과 object, function 등이 있습니다. # 오늘은 single item에 대해 공부해보도록 하겠습니다. # Single item은 number, string, boolean, null, undefined, symbol 등이 있습니다. # Visual Studio Code 및 Extension 설치 방법
#4. 자바스크립트(javascript) const # 자바스크립트(javascript)의 선언자 const를 알아보도록 하겠습니다. # Visual Studio Code 및 Extension 설치 방법
#3. 자바스크립트(Javascript) Block scope # 이번에는 block scope에 대해서 알아보도록 하겠습니다. # Visual Studio Code 및 Extension 설치 방법
#2. 자바스크립트(javascript) 변수와 console.log # 자바스크립트 변수(variable)에 대해 알아보도록 하겠습니다. # Visual Studio Code 및 Extension 설치 방법
#1. 자바스크립트(Javascript ) async와 defer # Javascript 첫 시간으로 우리가 작성한 Javascript가 어떤 순서로 실행되는지 간단하게 알아보도록 하겠습니다. # async 와 defer 의 차이를 알고 어느 방식이 더 좋은 방식인지 확인해보도록 하겠습니다. # Visual Studio Code 및 Extension 설치 방법 c 의 순서로 바뀌면서 문제가 생길 수 있습니다. 다음 예시는 defer를 사용했을 때의 예시입니다. 이 경우 a, b, c 파일을 모두 다운로드 받고 HTML이 모두 parsing 된 다음부터 순차적으로 javascript를 실행합니다. 이 때문에 사용자들은 빠르게 page를 확인할 수 있고, 순차적으로 javascript가 실행되기 때문에 순서가 바뀔 걱정을 하지 않아도 됩니다. 지금까지 javascript의..
[첫번째 Project] :: 반응형 Nav Bar 만들기 3. # 이번 시간에는 Nav bar를 꾸미고, 크기에 윈도우의 크기에 따라 반응하는 반응형으로 만들어보도록 하겠습니다. # 이 장에서는 Javascript가 일부 사용됩니다. 크게 어렵지 않은 부분이라 쉽게 따라하실 수 있을 거라고 생각합니다. # Visual Studio Code 및 Extension 설치 방법
[첫번째 Project] :: 반응형 Nav Bar 만들기 2. # 오늘은 지난번에 만들었던 HTML에 CSS를 덧붙여 Nav bar를 꾸며보도록 하겠습니다. # CSS에서 색깔을 변수로 사용하는 방법과 Item 배치하는 방법에 대해서 알아보도록 하겠습니다. # Item 배치를 공부하시고 싶은 분은 "FlexBox" 와 "Display & Position" 을 공부해보시기 바랍니다. # Visual Studio Code 및 Extension 설치 방법 1) 현재 상태 지금까지 작성한 HTML을 확인해보면 왼쪽과 같은 모양인 것을 확인할 수 있습니다. 우리는 이제 CSS를 활용해 왼쪽을 오른쪽의 모습으로 바꾸도록 하겠습니다. 2) 전체 HTML 아래 과정을 진행하기 전에 CSS 파일을 HTML에 불러와서 사용해야합니다. 그 방법을 간단히 설명드리도록 하겠습니다. 1. ..

반응형