프론트엔드스쿨

3개월간 진행되는 프론트엔드 스쿨 과정은 길기도 하고 짧기도 한 시간일 수 있겠지만, 개발 공부에만 몰입하여 진행할 수 있는 좋은 기회라고 생각한다.난 이 과정을 다음과 같은 목표로 프론트엔드 개발자가 되기 위한 능력을 성장시키고자 한다.11월 : HTML / CSS

프론트엔드 스쿨의 강의가 시작되었다.GitHub 사용을 시작으로 html, CSS 강의를 배웠다.HTML Tag 종류와 사용 시 주의할 점Github GUI 버전 사용 방법vscode Web버전과제 (html 만들기)3주 동안은 HTML, CSS 위주의 과정으로

오늘도 마찬가지로 html 수업을 들었다.아래와 같이 정리하기로 했다.오늘 수업의 목표는 포트폴리오 작성 방향을 잡는 것이었고,이 과정을 통해 새로운 팀원들을 만나 워킹백워즈 방법으로 역량순 포트폴리오를 만들고, 피드백 루프를 설계하는 활동을 함께 하였다.문제해결능력

프론트엔드 스쿨 4일차 CSS 첫 수업 HTML 요소 내부에 style 속성을 사용하여 CSS 스타일을 적용하는 방법으로인라인 스타일은 해당 요소에만 스타일을 적용할 수 있다.내부 스타일 시트를 이용하는 방법은 HTML 문서 내의 head 태그에 style 태그를 사용

position 속성은 박스 구성요소들을 배치하기 위한 속성. 어떤 position 속성을 사용 하느냐에 따라 위치가 달라질 수 있으므로 전체적인 내용을 잘 이해하고 익숙하게 사용할 수 있도록 해야 한다.CSS positionposition 속성의 기본값으로, 요소를

컨텐츠를 정렬하거나 공간을 나눌 수 있는 CSS 속성의 집합정렬 방향을 결정축을 기준으로 배열의 위치를 조종하거나 아이템 간의 간격을 설정

오늘 배운 내용 1.Grid 그리드 컨테이너 : 그리드의 가장 바깥영역 그리드 아이템 : 그리드 컨테이너의 자식 요소들 그리드 트랙 : 그리드의 행(row) 또는 열(column) 그리드 셀 : 그리드의 한 칸 (개념적인 정의) 그리드 라인 : 그리드 셀을 구

사용자가 마우스를 요소 위에 올렸을 때 적용됩니다. 스마트폰이나 패드 류의 터치스크린 기기에서는 사용자의 손가락이 호버되는 시점을 알 수 없기 때문에 모바일 기기가 많아지면서 점점 사용 빈도가 줄어드는 기능입니다. 사용자가 요소를 실행할 때(버튼을 누르거나 링크를 클릭

CSS 애니메이션 만들기 .gif) index.html Button 애니메이션 만들기 .gif)

애니메이션은 애니메이션을 나타내는 css스타일과 애니메이션의 중간 상태를 나타내는 키프레임들로 구성되어 있다.애니메이션은 트랜지션보다 더 규모가 크고 복잡하며 다양한 효과를 가지고 있기 때문에 좀 더 정밀한 구현이 가능하다.자바스크립트에 비해서 간단하게 구현할 수 있다

.gif)

perspective(투영점)은 3D 원근감을 주는 초점이다.즉, 3D 환경을 만들기 위해서 사용자는 관찰자 지점, 즉 투영점(깊이감,원근감)을 구체화시켜야 하며, 이것이 입체감을 부여하게 된다.

웹사이트에서 PC, 스마트폰, 태블릿 PC 등 접속하는 디스플레이의 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 기법을 말한다.웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고, 하나의 공용 웹사이트를 만들어 다양한 디바이스에 대응할 수 있

https://www.netlify.com/github로 회원가입한 다음 New site from git을 선택지속적인 배포로 프로젝트를 github에 업로드를 하고, netify를 통해 원격저장소를 연결하면 netify가 사이트를 자동으로 완성해준다.gith

Vending machine

부트스트랩은 웹 프레임워크이다. 최소한의 작업으로 빠르게 결과물을 만들 수 있도록 구축해 놓은 종합 공구 세트라 생각하면 된다.부트스트랩은 form, button, table, navigator가 HTML, CSS로 미리 디자인 되어 있다.부트스트랩의 세부 설정이나 테

다른 css 없이 tailwind만으로 진행

Sass

1.HTML 문서 조작2.HTML문서에 대한 조작(태그,속성,스타일)을 통해서 데이터를 얻어온다.유효성 검사3.서버에게 데이터를 보내기 전에 검사1.타입을 명시하지 않고, var 키워드를 사용하여 선언한다.2.var 키워드 입력하지 않으면, 반드시 전역변수가 된다.3.

연산자: ||(또는)형태: 불 || 불 -> 적어도 하나만 true면 전체가 truetrue || true -> truetrue || flase -> truefalse || true -> trueflase || false -> flase​연산자: &&(그리고)형태: 불

변수(타입)Array(배열)형태 : '하나', '둘', '셋', 100, 200, 300,호출 : 변수명, 변수명0, 변수명0 (변수명index)String(문자열)형태 : 'abcde', "abcde", abcde호출 : 변수명, 변수명0Number(숫자)형태 : 1

객체의 모든 열거 가능한 속성에 대해 반복.즉, 배열 뿐만 아니라 일반적인 객체의 속성들을 모두 반복할 때도 사용 가능.모든 객체의 key(배열의 경우 인덱스)에 접근할 수 있지만 value에 접근할 수는 없음.반복 가능한(Iterable)객체의 값을 순환. 배열 이외

자바스크립트 함수 안에서 다시 자신의 함수를 호출하면서 로직을 처리하는 경우를 말한다

객체지향에서 객체는 우리눈에 보이는 구체화된 대상을 의미객체는 속성과 행위로 정의 할 수 있으며 객체를 정의할 수 있는 틀을 클래스(Class)라고 한다. 클래스는 멤버변수와 메서드로 정의하게 되고 클래스로 부터 객체를 생성(인스턴스)해서 사용하는 개념this는 메소드

지금까지의 컨디션의 점수를 말하시오8점why? 규칙적인 생활을 해서 생체리듬을 지킬수 있기 때문이다멋사를 수료한 미래 시점의 나는 어떤 모습이었나요?\->긴장하고 땀을 흘리면서 면접을 하는 모습면접관과 피면접자를 보면서 어떤 인사이트를 얻었나요?\->분위기가 좋아야 한

document 객체를 말하며 DOM 트리에 접근하기 위한 최상위 노드로 모든 DOM 트리에 접근하기 위한 시작점이 된다.HTML 구성 요소 즉 대표적으로 대그를 의미한다. 문서내 태그들은 모두 Element Node 들이다. 각각의 Element Node 는 다시 A

자바스크립트를 이용해서 다양한 작품들을 직접 만들어보았다,직접 움직이는 것을 만들어보는 것은 처음이다

SOP 가 무엇인지 설명해주세요.embeddingCORS가 무엇인지 설명해주세요.브라우저가 웹 페이지를 랜더링하는 과정을 설명해주세요GET 방식, POST 방식에 대해 설명해주세요CSS Sprite기법에 대한 정의와 장단점에 대해 설명해주세요.형상관리도구(버전 관리 시

pixel ratio에 대해서 설명을 해주세요다음 이미지 포맷에 대해 각 특징에 대해 설명 해 주세요. (JPG, GIF, PNG, SVG)margin collapsing 현상에 대해 말해주세요event delegation (이벤트 위임)에 관해 설명해주세요.클로져(C

https://serene-volhard-39699d.netlify.app/

chart.js 공부 github 심화과정 공부 앞으로 있을 프로젝트 공지

.gif) ![](https://images.velog.io/images/skdksldk2/post