thumbnail

5. Flex Panels Image Gallery

image.png 개요 사용자 입력을 받아 분할된 div 에 변화를 주어보자. 배운 점 1. CSS : flex layout - flex layout 은 Items 과 이를 감싸고 있는 Container 로 구성되어 있습니다. - Itmes 비율을 조절하기...

2019년 11월 29일0개의 댓글

twittler

image.png 개요 username, message 를 입력받아 시간의 역순으로 트윗을 기록합니다. 트윗의 username 을 클릭하면 해당 user 의 트윗을 보여줍니다. 주요 로직 소개 username, message, time 을 받아 트윗을 작성하...

2019년 11월 28일0개의 댓글

4. Array Cardio Day

개요 Array 의 prototype function 을 사용해보자. foreach, sort, reduce, map 배운 점 1. Array 의 prototype function 인 foreach, sort, reduce, map 의 사용법을 실습해 보았습니다....

2019년 11월 22일0개의 댓글

3. Playing with CSS Variables and JS

image.png 개요 range, color input 태그에 이벤트 리스너를 달아보자. 배운 점 1. CSS 내에서의 변수 값 사용 - :root 문서의 최상위 단계에 정의되는 요소. - `` 키워드를 통해 CSS 에서 변수를 사용할 수 있습니다....

2019년 11월 21일0개의 댓글

[toy1] 작업기록 2

image.png 주요 작업 내용 1.API 문서를 기반으로 metadata 를 만들고 JSON parse 를 이용해서 response 값 분석과 metadata 의 값을 맞추었습니다. 삽질 & 후기 - DB 를 사용하면 간단하게 될 것 같은 metadata...

2019년 11월 20일0개의 댓글

[toy1] 작업기록 1

주요 작업 내용 1. 기상청 '동네예보정보조회서비스' API 가져오기 - D+3 일의 일기 예보를 가져올 수 있는 API 를 찾았습니다. key 발급도 쉽고 바로 활용할 수 있었습니다. - get 방식만을 지원하며 XMLHttpRequest 를 통해 값을 가져왔습니다...

2019년 11월 19일0개의 댓글

[toy1] toy1 을 시작하면서..

공부를 하는 것과 별개로 목표를 잡고 ToyProject 를 만들어보기로 했습니다. 기획을 고려할 단계는 아니기 때문에 내가 아는 기술들로 구현이 가능한 범위부터 단계적으로 만들 수 있는 것과 가능하면 내가 정말로 사용할 만한 것을 생각해 보았습니다. 우선 순위나 ...

2019년 11월 19일0개의 댓글

2. CSS + JS Clock

image.png 개요 현재 시간에 대응하여 움직이는 아날로그 시계를 만들어보자. 배운 점 1. CSS property 사용 - transition: 정해진 시간 동안 요소의 속성값을 부드럽게 변화시킬 수 있습니다. 3. setInterval 메서드를 통한...

2019년 11월 18일0개의 댓글

1. JavaScript Drum Kit

image.png 개요 키보드 이벤트에 반응하는 div 와 audio 태그를 만들어보자. 배운 점 1. Array.prototype.forEach() 의 사용 - Array 객체에서만 사용할 수 있으며 CallBack 함수를 매개변수로 받아 Array 의 모든 ...

2019년 11월 16일0개의 댓글

0. JavaScript30 을 시작하며..

image.png 개발자 부트캠프를 기다리면서 목표가 흐릿한 공부를 하는 것보다는 무엇이라도 만들면서 하는 것이 좋다고 생각되어 검색을 하던 중 30일간 진행되는 Vanilla JavaScript 챌린지를 찾았다. 이미 어느 정도 문법이 익숙한 것을 전제로 한 ...

2019년 11월 16일0개의 댓글

CSS

CSS 란? HTML 이 정보를 표현한다면 CSS 는 HTML 을 시각적으로 꾸며주는 역할을 합니다. HTML 에서 디자인을 구현하기 위하여 초기에는 추가적인 tag 를 사용 하였습니다. (ex. font) 하지만 그런 경우 유지보수의 어려움이 있고 정보와 디자인이 ...

2019년 10월 23일0개의 댓글

참고용 링크

Visual Studio Code 단축키

2019년 10월 18일0개의 댓글

Javascript 자료구조

Array 배열 선언 후 map 을 사용 시에는 먼저 할당을 하여야 한다. 빈 배열에 map 을 하여도 에러는 발생하지 않지만 NAN 이나 undefined 도 나오지 않아 위험성이 있다.

2019년 10월 16일0개의 댓글

testbuilder (2)

STEP FOUR - class CardInfo - getCardInfo() CardInfo 에는 여러개의 prefix 와 length 가 들어갈 수 있습니다. 이 메서드를 통해서 조합 되는 모든 경우의 구분자를 리턴 받습니다. - class AllCardIn...

2019년 10월 16일0개의 댓글

testbuilder (1)

image.png Koans 과제가 web 으로 결과를 보며 피드백을 하는 형태라면, testbuilder 과제는 console 에서 시작했다. 구현 내용은 CARD BIN 을 통해 카드의 종류를 확인하는 로직으로 파악하고 시작했다. (CARD BIN 체크는 이전의 ...

2019년 10월 16일0개의 댓글

JavaScriptKoans

과거 JAVA 개발 당시 try-catch 문의 단위 테스트, 유닛 테스트의 개념은 알고 있었지만 범위가 작고 혼자 개발했었기에 큰 활용을 하지 않았던 기억이 있다. 그리고 개념적으로만 TDD 를 들어본 나에게 jasmin 을 활용한 Koans 과제는 매우 흥미로웠다....

2019년 10월 16일0개의 댓글

코드스테이츠 Pre Course 를 시작하며..

개발자 부트캠프를 알아보면서 제일 눈에 띄는 곳은 코드스쿼드와 코드스테이츠였다. 하지만 두 곳 모두 2020 년 초에야 전문가 과정이 오픈하기 때문에 시간이 뜰 수 밖에 없었고 먼저 기초를 다지자는 생각으로 온라인 교육을 듣기로 했다. 코드스쿼드는 수강이 끝났고 코드...

2019년 10월 16일0개의 댓글

Javascript 기본

논리값 - Falsy 값 거짓 같은 값 (Falsy) 은 불리언 문맥에서 false 로 평가되는 값입니다. 참조 논리값

2019년 10월 15일0개의 댓글

Javascript Style Guide

Indentation – 들여쓰기 - 논리적으로 종속되어 있는 코드를 쓸 때, 종속된 code block는 주인 code block보다 두 칸 들여쓰기 합니다. 들여쓰기를 할 때 탭이 아닌 스페이스를 사용하세요. 탭은 안됩니다. Naming – 이름 짓기 - 1....

2019년 10월 15일0개의 댓글

TIL [19.10.13 ~ 19.10.22]

코드스테이츠 Pre 과정 - Level 2, 3 학습 - 협업 툴을 통한 프로그래밍 - github : fork, clone 사용법 - 심화 문제 풀이 - 자스민 사용법 익히기 코드스테이츠 심화 과제 블로깅 - JavaScriptKoans - testbuild...

2019년 10월 14일0개의 댓글