profile
콘텐츠 마케터에서 프론트엔드 개발자로...

TIL #2 - 201204

TIL #2 - 201204

2020년 12월 4일
·
0개의 댓글
·

TIL #1 - 201203

TIL #1 - 201203

2020년 12월 3일
·
0개의 댓글
·

javascript로 to-do list 만들기

본 내용은 '노마드코더' 바닐라 JS 크롬 앱 만들기 강의를 보고 정리된 글입니다. to-do 를 작성하는 form, input 생성한다. 작성한 to-do list 화면에 계속 보여지는 곳을 생성한다. (ul)forEach : 배열에 요소들에 순서대로 콜백함수를 실행

2020년 10월 26일
·
0개의 댓글
·

javascript localstorage로 이름 기억하기

본 내용은 '노마드코더' 바닐라 JS 크롬 앱 만들기 강의를 보고 정리된 글입니다. 사용자가 입력할 수 있는 입력창을 만든다 (form > input)사용자를 기억한 후 출력될 글자 요소 공간도 만든다. (h4)js if문으로 localstorage에 기억되는 값이 있

2020년 10월 25일
·
0개의 댓글
·

javascript로 시계만들기

본 내용은 '노마드코더' 바닐라 JS 크롬 앱 만들기 강의를 보고 정리된 글입니다. 시계를 만들기 위해 시계가 출력될 공간(?)을 만든다.class명은 css와 js에서 모두 사용하고자 할 경우에는 구분하여 'js-clock'으로 만들어 주는 것도 좋다.시계를 출력할

2020년 10월 25일
·
0개의 댓글
·

CSS flexbox

css에서 강력한 정렬기능을 제공하기 위해 고안되었다. 두 개의 축에 대해 명확히 이해해야 정확히 다룰 수 있다. nowrap : 부모 박스 사이즈에 맞춰서 강제로 자식 요소 사이즈를 줄여서라도 무조건 한줄로 정렬됨.: flex-direction 으로 지정된 메인 축

2020년 10월 25일
·
0개의 댓글
·

자바스크립트 기본

웹페이지를 동적으로, 프로그래밍적으로 제어하기 위한 언어요즘은 탈웹이라고 해서 단순 웹브라우저만을 위한 언어가 아닌 node.js와 같이 서버에서도 활용하며, 그 외 다양하게 활용가능한 언어이다. : 일반적으로 우리가 알고 있는 숫자('',""가 붙지 않은 숫자)📔

2020년 10월 25일
·
0개의 댓글
·

CSS Box

📦 CSS Box Model ✏️ content : 콘텐츠가 있는 상자 (width/height) ✏️ padding : 안쪽 여백 ✏️ border : 테두리 >🔎 특징 굵기, 스타일, 색상 지정 필수 (ex:px, solid, blue) border-ra

2020년 10월 24일
·
0개의 댓글
·
post-thumbnail

CSS Position

문서 상에서 요소를 배치하는 방법을 지정한다. top, bottom, left, right가 최종적으로 위치를 지정한다. 위치 지정시 top, bottom 둘중 1개, left, right 둘중 1개만 사용하는 걸 추천한다.z-index : 수직방향 (정수로 위치 지정

2020년 10월 19일
·
0개의 댓글
·
post-thumbnail

CSS float

특정 요소를 기존 문서 흐름에서 벗어나 '붕~뜨게' 만든다.'붕~뜬다', '부유하다'라는 의미는 부모 요소 박스에서 float가 된 자식 요소가 부모 박스가 인식하지 못하는 요소가 되어 '집나간 자식'이 된다. 주변 형제 요소도 해당 float된 요소를 인식하지 못한다

2020년 10월 19일
·
0개의 댓글
·
post-thumbnail

CSS selector

Type(요소) : HTML 태그 직접 지정class : class 선택 (.)ID : ID 선택 (자식 선택자 (>)자손 선택자 (공백)형제 선택자 (+,~):first-child : ~의 첫번째 요소:last-child : ~의 마지막 요소:nth-child(n)

2020년 10월 18일
·
0개의 댓글
·
post-thumbnail

CSS 기초

css meme 하면 가장 흔히 나오는 짤이다.유튜브를 슬쩍보고 수박 겉핥기로 css를 잠시 배우고 클론코딩으로 유튜브 일부 화면을 만들어 보고나서 나도 저 짤이 너무나 공감이 됬다. 왜들 css가 어렵다고 하는지 절실히 느꼈다. 그래서 다시 제대로 배우고, 제대로 이

2020년 10월 18일
·
0개의 댓글
·

HTML5 구조적인 마크업 요소들

html 문서 구조를 쉽게 마크업하기 위한 구조적인 요소들에 대해 알아보자.🔖 header : 문서의 서론, 대표적인 부분🔖 main : 문서당 1개, 문서의 주요 내용🔖 nav : 네비게이션바, 메뉴 🔖 article : 따로 독립적으로 존재해도 정보인 것🔖

2020년 10월 18일
·
0개의 댓글
·

HTML 기초

📚 HTML 이란 무엇인가? Hyper Text Markup Language 웹브라우저를 구성하는 가장 기초가 되는 마크업 언어 📒 Sementic HTML HTML을 마크업할 때 단순 나열이 아닌 정보와 의미에 맞춰 태그를 사용하는 것 코드 수정 시 편리, 검색

2020년 10월 15일
·
0개의 댓글
·