부트캠프

Javascript

[Javascript] 데이터 타입과 변수

1. 데이터 타입 1-1. 숫자(number) 타입 1-2. 문자열(string) 타입 1-3. 불리언(Boolean) 타입 1-4. 기타 2. 변수 2-1. 변수 선언과 할당 2-2. 변수 호이스팅 1. 데이터 타입 자바스크립트의 모든 값은 데이터 타입을 갖는다. 자바스크립트에는 7개의 데이터 타입이 있다. 7개의 데이터 타입은 원시 타입(primitive type)과 객체 타입(object type)으로 분류할 수 있다. 이중 원시 타입에는 숫자, 문자열, 불리언, undefined, null, 심벌 타입이 있다. 1-1. 숫자(number) 타입 자바스크립트의 숫자는 모두 실수로 처리된다. 숫자 타입에는 세 가지 특별한 값이 포함된다. Infinity: 양의 무한대 -Infinity: 음의 무한대 ..

프로젝트/미니 프로젝트 & 과제

[과제] 계산기 목업 만들기

오늘은 내가 만든 결과물을 자랑하면서 시작! 어제 배운 CSS flex를 활용해 계산기 목업 만들기에 도전했다. 처음에는 그냥 맥북 기본 계산기를 따라서 만들었는데 크루님이 지난 기수에서 만든 계산기를 보여주시면서 약간 디자인 경쟁(?)이 붙었다 ㅋㅋ 결과적으로 여러 학생들의 다양한 디자인의 계산기가 탄생해 영감을 받는 계기가 되었으니 계산기 대축제는 좋았던 것으로👍 내가 만든 계산기는 윈도우 1.0 시절의 계산기를 본따서 만들었다. 정말 유행과 감성이라는 것은 돌고 도는 것인지 근 40년 전의 계산기가 이렇게나 힙하고 예뻐 보일 일인지! 계산기 목업 제작 어려웠던 점 처음에 애를 먹었던 것은 flex의 각 속성들에 대한 이해가 부족한 것 때문이었다. 너무 여러 속성과 그 속성값이 있다 보니 완전히 익히..

코드스테이츠 프론트엔드 부트캠프

[CSS] flex의 활용(서로 다른 column에 있는 item 어긋남 해결하기)

오늘은 CSS flex 활용법을 공부했다. 혼자서 공부할 때 레이아웃을 짜느라 고생이 많았는데 flex를 활용하니 레이아웃 짜기가 훨씬 수월했다! 레이아웃의 흑역사 오늘 flex 수업을 듣기 전에 생활코딩으로 예습을 했는데 flex 첫 수업에서 '레이아웃의 흑역사'를 소개하면서 시작한 것이 아주 인상적이었다. 생활코딩 flex-1 요지는 인류 역사 동안 레이아웃을 코드로 잘 표현하는 방법을 찾기 위해 고군분투 해왔다는 것인데 레이아웃을 짜는 데 활용되는 여러 코드들의 차이점을 알려 줘서 매우 유익했고, 또 내가 레이아웃을 짜느라 고생한 것이 그리 이상한 일은 아니었다는 점을 알게 돼 위안이 됐다.😂 서로 다른 column에 있는 item 어긋남 해결하기 오늘 수업에서는 flex를 활용해 직접 레이아웃 예..

코드스테이츠 프론트엔드 부트캠프

[CSS] 자기소개 페이지 만들기

오늘 수업에서는 CSS를 활용하는 법에 대해서 배웠다. 이미 배운 내용이라고 생각했는데 자세히 살펴 보니 비어 있던 부분들이 있어 열심히 메모하고 암기하며 실습에서 적용해 보려 했다. 반응형 웹에 적합한 CSS 활용 font-size px은 절대 단위라서 다양한 사용자 환경에서 접근성이 떨어질 수 있다. 일반적인 경우 font-size는 rem 단위로 설정하자. ※ rem과 em의 차이 rem은 최상위 요소(html)의 font-size를 기준으로 한 값이고 em은 현재 사용되고 있는 요소의 font-size를 기준으로 한 값이다. width, height viewport 대비 상대적 크기가 중요한 경우에는 vw, vh를 활용하면 좋다. margin, padding 초기화하기 *{margin=0; pad..

코드스테이츠 프론트엔드 부트캠프

코드스테이츠 프론트엔드 부트캠프 2일차 후기

오늘은 본격적으로 부트캠프 수업이 있던 날이었다. html을 배우는 시간이었는데, 짧고 굵게 그동안 배웠던 것들을 점검해 볼 수 있었다. html이란? html은 HyperText Markup Language의 줄임말로, 웹페이지의 구조를 이루는 마크업 언어이다. html을 건물에 비유하면 뼈대를 세우는 과정이라고 할 수 있다. 와 는 대표적인 block element로 웹페이지의 한 줄을 전부 차지하는 태그인 반면, 은 inline element로 컨텐츠만큼의 공간만을 차지한다. 시맨틱 태그의 중요성 시맨틱 태그(Semantic tag)란 의미를 부여한 태그다. 나 처럼 단순히 구역을 구분하는 의미만 가진 태그는 자유도가 높아서 큰 제약 없이 어디에나 활용할 수 있다는 장점이 있지만, 반면에 해당 태그..

코드스테이츠 프론트엔드 부트캠프

코드스테이츠 프론트엔드 부트캠프 1일차 후기

기다리던 코드스테이츠 프론트엔드 부트캠프 개강 날이었다! 오늘은 본격적인 학습에 들어가기에 앞서 여러 학습 프로그램들을 세팅하고 부트캠프 동안 진행될 프로그램을 알아보고 학습에 참여하는 마음가짐을 다잡는 시간을 가졌다. 남과 비교하지 말고 나 자신과 목표에 집중하자 오늘 들었던 세션들 중 가장 와닿았던 것은 마지막 정리 세션이었는데, 부트캠프를 진행하며 가져야 할 마음가짐과 학습을 위한 자세를 소개해 주는 내용이었다. 1. 완주할 수 있는 속도와 자세로 학습하기 2. 남과 비교하지 않고 나 자신의 목표에 집중하기 이 시간에는 성공적인 학습을 위해서 이 두 가지를 강조했는데, 특히 두 번째가 중요한 포인트라고 느꼈다. 남과 비교하지 말고 나의 목표에 집중하며, 꾸준히 성장하고 배워 나가는 사람이 돼야겠다...

코드스테이츠 프론트엔드 부트캠프

코드스테이츠 프론트엔드 부트캠프 44기 합격 후기

코드스테이츠 프론트엔드 부트캠프에 합격했다! 🥳🥳 경쟁률이 어마어마하더라 하는 얘기를 너무 많이 들어서 마음을 졸였는데 합격해서 정말 기뻤다. 부트캠프를 지원하는 사람들이 많아서인지 선발 절차가 꽤나 까다로웠다. 자기소개 - 학습 적합성 검사 - 취업 적합성 검사 - 학습 역량 진단 이렇게 총 네 단계의 지원 절차를 거쳐야 한다. 나는 자기소개에 상당히 오랜 시간을 들였는데, 처음에 써 놓고서 생각날 때마다 계속 내용을 고쳤다. 처음에는 그저 열정이 넘쳐 무조건 열심히 하겠다!! 같은 내용을 적었는데, 단지 열심히 하겠다는 내용만으로 뽑아줄까? 하는 의문이 들었고, 내가 만약 선발 담당자라면 어떤 사람을 뽑고 싶을까? 하는 고민을 하게 됐던 것 같다. 여러 고민을 하다가 내린 결론은 부트캠프 없이도 열심..

JeanneLee57
'부트캠프' 태그의 글 목록 (4 Page)