# nomad

25개의 포스트
post-thumbnail

220811 TIL

✔️ CSS Layout그럼 이번에 fr 이란걸 알아볼 것 이다.fr 의 뜻은 fraction(부분)이다.(pixel 이나 %와 같은 것이다. 정확히는 측정 단위다.)그럼 fraction 이 어떻게 작동하는지 알아보자!우리 코드를 보면...화면을 보면...크기는 가로

어제
·
0개의 댓글
·
post-thumbnail

220808 TIL

✔️ CSS Layout이번에 알아볼 것은 개발 환경에서 쓸 수 있는 기능에 대해 알아보겠다!그건 바로 line 에 이름을 붙이는 것이다.저번 코드를 수정해본다면...전에는 grid-template-colums 값을 repeat(4, 100px) 로 지정해두었지만, 이

4일 전
·
0개의 댓글
·
post-thumbnail

220807 TIL

✔️ CSS Layout저번에 이어서 하자면, 필요없는 template-areas 부분들은 다 지워준다.전에 배웠던걸 생각해보면, header 가 맨 위에 있고 content 와 nav 가 중간에 그리고 footer 가 맨 마지막에 자리잡았었다.grid area 를 사

5일 전
·
0개의 댓글
·
post-thumbnail

220805 TIL

✔️ CSS Layout저번에 grid 를 입문하고 오늘은 grid-template-areas 에 대해 알아보겠다.우선 새롭게 코드를 작성해봤는데...결과는...이렇게 가로 길이 200px 과 세로 길이 300px 를 가지고 있는 색 다른 박스들을 볼 수 있다.colu

2022년 8월 5일
·
0개의 댓글
·
post-thumbnail

220804 TIL

✔️ CSS LayoutGrid 는 flex 와 동일하게 부모 요소한테 써주면 된다.예 )grid 는 flexbox 와 거의 비슷한 규칙을 가지고 있다.대부분의 시간을 부모 요소에 대해 얘기할 것 이다.flexbox 처럼 자식 요소에 대해 얘기할 것이지만, grid d

2022년 8월 4일
·
0개의 댓글
·
post-thumbnail

220803 TIL

TIL DAY 198 오늘 배운 일 ✔️ CSS Layout 🎲 IIII) Flexbox 오늘은 flex-grow, flex-shrink 에 대해 배워볼건데... 이 두개의 property 들을 자식 요소에게 줄 수 있다. 예를 보면... index.ht

2022년 8월 3일
·
0개의 댓글
·
post-thumbnail

220801 TIL

TIL DAY 197 오늘 배운 일 ✔️ CSS Layout 🔳 III) Flexbox 저번에 이어서 flexbox 세 번째 시간을 가져볼려고 한다. 우선 저번 예제를 보자! index.html style.css 결과물 저번에 말헸듯이, flex-di

2022년 8월 1일
·
0개의 댓글
·
post-thumbnail

220731 TIL

✔️ CSS Layout어제 공부한 flexbox 예제를 이어가자면...body 태그 안에 3개의 div 태그들이 존재하는데, 각자 가로 세로 길이가 200px 이다.display flex 를 사용해서 inline-block 같은 효과로 생각할 수 있지만, 각 박스 사

2022년 7월 31일
·
0개의 댓글
·
post-thumbnail

220730 TIL

✔️ CSS Layout먼저 flex 에 대해 알아가지 전에...display 의 대표적으로 쓰이는...inline blockinline-block의 차이점을 알아보자!예 )코드index.htmlstyle.css결과...인라인 요소는 가로 세로 길이를 가질 수 없다!그

2022년 7월 30일
·
0개의 댓글
·
post-thumbnail

220725 TIL

✔️ Typescript이전에는 인터페이스와 타입의 차이점에 대해 알아보았다.둘 다 같은 목적으로 사용할 수 있는데, 타입스크립트에게 객체의 모양을 알려줄 수 있다.하지만 인터페이스와 타입을 상속하는 방법은 조금 다르다.그리고 인터페이스 같은 경우에는 다른 프로퍼티들을

2022년 7월 25일
·
0개의 댓글
·
post-thumbnail

220721 TIL

TIL DAY 193

2022년 7월 21일
·
0개의 댓글
·
post-thumbnail

220717 TIL

✔️ Typescript이번에는 객체 지향 프로그래밍인 class (클래스) 에 대해 알아보겠다!자바스크립트가 익숙한 사람들은 클래스에 잘 알고 있을것이며, 타입스크립트의 클래스와는 별반 차이가 없다.그 둘을 서로 비교해보자면...constructor 함수를 만드는 건

2022년 7월 17일
·
0개의 댓글
·
post-thumbnail

220715 TIL

✔️ Typescript먼저 Poly 는 많은, 다수란 뜻이고 그리고 morphism 은 형태를 뜻한다.즉, 여러가지 다른 구조들이라는 의미!이전에 다양한 구조의 함수들이 보았듯이, 개념은 어렵지 않다. 다음으로...예를 들어볼건데 배열을 받아, 그 배열의 결과를 pr

2022년 7월 15일
·
0개의 댓글
·
post-thumbnail

220714 TIL

✔️ Typescriptfunction overloading 또는 method overloading 이라고 불리기도 한다.우리는 overloading 을 외부 라이브러리를 사용할 때 많이 이용한다.오버로딩은 함수가 여러개의 call signatures 을 가지고 있을

2022년 7월 14일
·
0개의 댓글
·
post-thumbnail

220711 TIL

✔️ Typescript우선 함수를 다시 보자면...예 ) 아무런 타입을 지정하지 않았을 때두 개의 파라미터는 any 라는 타입이 있다고 한다.그리하여, 우리는 타입을 지정해주어야 한다!add 라는 함수에다가 마우스를 갖다대면...number 타입을 가진 값을 리턴한다

2022년 7월 11일
·
0개의 댓글
·
post-thumbnail

220710 TIL

✔️ Typescript전에 이어서 독특한 타입을 몇 가지 알아보겠다.우리는 이전에 흔히 자바스크립트에서도 쓰이는 타입들을 다뤄보았다(number, string, boolean, number array, boolean array)이번엔 타입스크립트에서만 존재하는 것이고

2022년 7월 10일
·
0개의 댓글
·
post-thumbnail

220709 TIL

✔️ Typescript요소들을 '읽기 전용'으로 만들어 준다자바스크립트에는 없는 보호장치밑에 코드에서 타입 Player 에서 name 을 readonly 로 설정하고 싶다면...프로퍼티 앞에 readonly 라고 작성하면 끝!이렇게 설정해두면, Player 의 nam

2022년 7월 9일
·
0개의 댓글
·
post-thumbnail

220707 TIL

✔️ Typescript전에 배운 기본적인 타입들...a 는 숫자 타입을 가지고 있고, b 는 문자열 타입을 가지고 있고 마지막으로 c 는 boolean 타입이고 배열 형태를 가지고있다.하지만 만약에 a 와 b를 array 형태인다면?c 처럼 값을 대괄호로 감싸줘야한다

2022년 7월 7일
·
0개의 댓글
·
post-thumbnail

[프론트엔드] Clock

간단한 시계 만들기!

2022년 6월 30일
·
0개의 댓글
·
post-thumbnail

220627 TIL

✔️ Typescript Typescript 은 자바스크립트 기반으로 만들어진 프로그래밍 언어!자바스크립트 말고 타입스크립트로 넘어온 이유는...정확히 말하자면... 타입 정확성!쉽게 말하면 에러나 버그가 자바스크립트에 비해 덜 생긴다더 나은 구조와 간결함으로 생산성이

2022년 6월 27일
·
0개의 댓글
·