Front-End (Basic Study)

예전에 html을 공부했었지만 다시 한 번 더 훑어보면서챙기지 못한 부분을 정리하고자 한다.업로드중..웹페이지를 기술하기 위한 마크업 언어.웹페이지의 내용과 구조를 담당하는 언어로써 HTML 태그를 통해 정보를 구조화하는 것HTML5 문서는 반드시 <! DOCTY

HTML이나 XML과 같은 구조화 된 문서를 화면, 종이 등에 어떻게 렌더링할 것인지를 정의하기 위한 언어HTML의 각 요소의 style을 정의하여 화면 등에 어떻게 렌더링하면 되는지 브라우저에게 설명하기 위한 언어👉 결과👉 결과Box는 콘텐트(Content), 패

1. 반응형 웹 디자인(Responsive Web Design)란? 화면 해상도에 따라 가로폭이나 배치를 변경하여 가독성을 높이는 것 즉, 하나의 웹사이트를 구축하여 다양한 디바이스의 화면 해상도에 최적화된 웹사이트를 제공하는 것 1.1 viewport meta t

업로드중..현재 article은 layout에 상관없이 1행에 1개씩 배치되었다.article을 2열로 배치하기 위해서 width 값을 지정하여야 한다. %로 width 값을 지정하여 viewport에 상대적인 너비를 갖도록 한다. 이때 margin도 %로 지정한다.

Flexbox는 모던 웹을 위하여 제안된 기존 layout보다 더 세련된 방식의 니즈에 부합하기 위한 CSS3의 새로운 layout 방식이다.요소의 사이즈가 불명확하거나 동적으로 변화할 때도 유연한 레이아웃을 실현할 수 있다. 복잡한 레이아웃이라도 적은 코드로 보다 간

자바스크립트는 우리의브라우저에서 언제든지 사용 할 수 있다.크롬 개발자 도구에서 Console 탭을 열고 입력창에 다음 코드를 입력해보자.스크린샷 2022-10-03 오후 2.49.02.png위 이미지와 같이 Hello JavaScript! 가 보여진다.

변수와 상수는, 특정 이름에 특정 값을 담을 때 사용한다.예를 들어, value 라는 이름에 1 이라는 값을 넣는다고 가정해보자.다음과 같이 입력.이제 value 를 조회하면 value 는 1을 가리키게 된다.예를 들어서 우리가 이전에 배웠던 console.log 를

연산자 : 프로그래밍 언어에서 특정 연산을 하도록 하는 문자여기서 두번째 줄에서 사용된 = 문자가 바로 연산자이다. 그 중에서 = 는, 대입 연산자에 해당된다. 첫번째 줄은 새로운 변수를 선언하는 것으로서, 대입 연산자에 해당하지 않음.산술 연산자 : 사칙연산과 같은

아래는 기기에 따라 breakpoint를 정의한 것이다.Non Mobile First Method로 정의하였기 때문에 Media Query로 정의하지 않은 스타일은 데스크탑 그룹을 위한 코드이다.CSS 적용 우선 순위에 따라 나중에 선언된 스타일이 먼저 적용된다. 따라

: 현재 실행 중인 태스크가 종료할 때까지 다음에 실행될 태스크가 대기하는 방식.장점 태스크를 순서대로 하나씩 처리하므로 실행 순서가 보장됨단점 앞선 태스크가 종료할 때까지 이후 태스크들이 블로킹 됨함수를 호출하면 함수 코드가 평가되어 함수 실행 컨텍스트가 생성됨.

조건문을 사용하면 특정 조건이 만족됐을 때 특정 코드를 실행할 수 있다.: 가장 기본적인 조건문: "\~~하다면 \~~를 해라" 를 의미👉 결과 : "a + 1 이 2 입니다."만약에 여기서 a 를 0 으로 바꾼다면?👉 결과 : 아무것도 출력되지 않음.if문을 사용

함수 : 특정 코드를 하나의 명령으로 실행 할 수 있게 해주는 기능위의 작업을 함수로 만들면,👉 결과 : 3함수를 만들 때는 function 를 사용하며, 함수에서 어떤 값을 받아올지 정해주는데 이를 파라미터(매개변수)라고 부른다.함수 내부에서 return 키워드를

함수 : 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것수학의 함수는 “입력”을 받아 “출력”을 내보내는 일련의 과정을 정의한 것.위처럼 미리 정의해 둔 함수를 실행하는 것을 수식으로 표현하면 f(2, 5)=7. 이때 함수의 x, y는

스코프(유효범위) :식별자가 유효한 범위자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념. 다른 언어의 스코프와 구별되는 특징이 있으므로 주의.❗️모든 식별자(변수 명, 함수 명, 클래스 명 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을

15.1 var 키워드로 선언한 변수의 문제점15.1.1 변수 중복 선언 허용만일 동일한 이름의 변수가 이미 선언되어있음에도 변수를 중복 선언하면서 값까지 할당했다면 의도치 않게 먼저 선언된 변수 값이 변경되는 부작용 발생.15.1.2 함수 레벨 스코프var 로 선언한

컴포넌트에서 필요한 외부 데이터들은 컴포넌트 내부에서 useAsync 같은 Hook을 사용해서 작업하면 충분하지만, 가끔 특정 데이터들은 다양한 컴포넌트에서 필요하게 될 때도 있는데 (예: 현재 로그인 된 사용자의 정보 등,,) 그럴 때 Context를 사용하면 개발이