nana_log - mysetting

3:13 5/30

nykim.work

mobile screenshot relative

3:13

nykim.work

mobile screenshot

nana_log
https://nykim.work/

좋아하는 걸 좋아하는 나나

저작도구: TISTORY

최종 피드 수집: 2024-04-12 00:49

전체 (29)

8M

[웹 성능 최적화] #1 브라우저는 어떻게 렌더링을 할까

프롤로그
면접관: “웹 사이트 성능 최적화에 대해 아는 대로 얘기해 보세요.”
???: “ㅈ..잘...? ”
(기술 면접에서 저 질문을 받았을 때의 짜릿함이란☆)

최적화! 왠지 중요하고 챙겨야할 거 같지만 잘 모르는 그것

etc.

렌더링

웹브라우저

+ 더보기

000

1y

2022년 회고

<일기 모아 제본하기>도 이걸로 어느덧 네 번째!
이제 익숙해질 때도 됐는데 매번 우당탕 헤매는 건 어째서?! (그리고 꼭 끝나야 보이는 오타... )

올해 제본 컨셉은 뭘로 할까 고민하다가 우주로 정했다. ✨
매달 회고를

Loves

001

1y

[React] Gatsby 찍먹해보기 - 설치부터 배포까지

프롤로그

저는 종종 로컬에서 시작해 로컬에서 끝나는 마크업 작업(aka 이메일 템플릿)을 진행하는데요,
나중에 파일을 찾으려면 하나씩 파일을 열고 닫아야 하는 수고스러움이 있었습니다.
"로컬에 흩어진 파일을 한 화면에서 볼

Tools

GATSBY

React

000

1y

[아무튼 Sass] 4. 더 멋지게 활용하기 - 흐름제어, 내장 모듈, 함수

프롤로그

백만 년 만의 업데이트! 이제 시리즈의 마지막 글입니다
흐름제어와 함수를 통해 Sass를 더 멋진 방법으로 활용해 봅니다.

아무튼 Sass 시리즈
1. 시작하기 - Sass 개념, 컴파일러 설치
2. 기본 작성

CSS

0011

1y

Framer-motion 라이브러리 훑어보기

프롤로그

Framer-motion은 Framer가 제공하는 리액트용 애니메이션 라이브러리입니다.
NomadCoders의 <React JS 마스터클래스> 를 듣던 중, framer-motion 라이브러리를 사용하는 내용이

Library

0020

1y

[아무튼 Sass] 3. 더 편하게 CSS 다루기 - mixin, extend, 모듈화(import/use)

프롤로그

이런 분들을 위한 글입니다.
- CSS를 다룰 수 있어요
- 하지만 Sass는 잘 몰라요

아무튼 Sass 시리즈
1. 시작하기 - Sass 개념, 컴파일러 설치
2. 기본 작성법 익히기 - 중첩, 참조, 변

CSS

css

SASS

000

2y

[아무튼 Sass] 2. 기본 작성법 익히기 - 중첩, 참조, 변수, 보간

프롤로그

[아무튼 Sass] 1. 시작하기의 다음 글입니다. 두 번째 글이지만 어느덧 반년만...

이런 분들을 위한 글입니다.
- CSS를 다룰 수 있어요
- 하지만 Sass는 1도 몰라요

아무튼 Sass

CSS

css

SASS

000

2y

CRA(create-react-app) 환경에서 절대경로 / 전역 Sass 사용하기

CRA
- 리액트 프로젝트를 뚝딱 시작할 수 있게 돕는 보일러 플레이트* (*자주 쓰는 수식, 명령어 등을 미리 입력해 놓는 것)
- 그래서 번거롭게 Babel, ESLint, Webpack 등을 따로 설치할 필요가 없다

JS

000

2y

[책 제본하기] 나만의 책 만들기 (2021 ver.)

프롤로그

이 글의 두 번째 글입니다.
대충 일기를 모아서 제본했다는 내용이에요
(1편을 작년에 쓰고 2편을 올해 쓰다니...)

실제로 책 제본을 진행하면서 어떤 식으로 했는지 정리해봤습니다.
개인제본 하실 때 참고하세

Loves

001

2y

[ReactJS] 5. 타입스크립트

이 글은 NomadCoders의 <React JS 마스터클래스>의 내용 일부를 정리한 글입니다. ‍♀️ 멋진 강의 감사합니다 ‍♀️
개인 스터디 글로, 맞지 않는 내용이나 더 나은 방법을 공유해 주신다면 복받으실 거예요 ✨

Framework

000

2y

[ReactJS] 4. styled-components

이 글은 NomadCoders의 <React JS 마스터클래스>와 <벨로퍼트와 함께하는 모던 리액트 강의 노트>의 내용 일부를 정리한 글입니다. ‍♀️ 멋진 강의 감사합니다 ‍♀️
개인 스터디 글로, 맞지 않는 내용이나 더 나

Framework

000

2y

[ReactJS] 2. 기능 연습 & 3. 앱 만들기

이 글은 NomadCoders의 <ReactJS로 영화 웹 서비스 만들기> 강의 내용을 정리한 글입니다.
넘나 좋은 강의 (게다가 무료!) ‍♀️ 감사합니다 ‍♀️
개인 스터디 글로, 맞지 않는 내용이나 더 나은 방법을 공유

Framework

000

2y

[ReactJS] 1. 시작하기

이 글은 NomadCoders의 <ReactJS로 영화 웹 서비스 만들기> 강의 내용을 정리한 글입니다.
넘나 좋은 강의 (게다가 무료!) ‍♀️ 감사합니다 ‍♀️
개인 스터디 글로, 맞지 않는 내용이나 더 나은 방법을 공유

Framework

000

2y

border: 0 vs. border: none

결론
border: 0 쓰자!

보더 없앨 때 none 보다 0을 썼었는데 이유는 그게 더 치기 편하니까 (손꾸락은 소중하자나여)
그러다 어느날 앗 내가 혀를 어디다 두고 있었지! 를 자각하는 것처럼 0과 none의

CSS

000

2y

코어자바스크립트 - 자바스크립트 기본

자바스크립트 기본
https://ko.javascript.info/first-steps

엄격 모드
자바스크립트는 기존 기능을 변경하지 않고 추가만 하는 식으로 호환성 문제를 회피했습니다.
그런데 ES5(2009)에서 기존

JS

000

2y

reset.css vs. normalize.css

reset과 normalize가 필요한이유
브라우저에서 가장 먼저 적용되는 스타일은? User-agent Stylesheet !!
이는 브라우저에서 제공하는 기본 스타일인데 브라우저마다 그 내용이 다름다름 
그래서 똑같은 <but

CSS

000

2y

2021년 정보처리기사 실기 3회 보고 온 후기

"크크킄 그녀석은 기사 중 최약체지"
라는 말을 듣는 정처기지만, 아무튼 합격했습니다! 모로 가도 땄으면 된 걸로 ;)

이런저런 일로 포스팅을 미루고 있었는데, 이것도 안 쓰면 또 까먹을 거라 더 늦기 전에 써

etc.

시험

정보처리기사

정처기

000

2y

일기로 나만의 책 만들기 2020

재작년에 하고 싶었던 일을 올해 8월에 끝낸 사람이 있다?!!

드디어!!!! 책으로 만들었씁니당!!! (자랑자랑)
재작년 11월부터 써온 일기를 묶어 제본했습니다 ✌️

B6 사이즈로 하드커버, 총 220 페이지입니다.

Loves

일기책

제본

000

2y

[아무튼 Sass] 1. 시작하기 - Sass 개념, 컴파일러 설치

프롤로그

"CSS 인생은 전처리기를 도입하기 전과 후로 나뉜다"
......이런 말은 없지만, Sass를 배우면 CSS 작성이 짱짱 편해집니다.
신입 퍼블리셔부터 스타일시트 관리를 하는 개발자까지,
Sass에 대해 한번 정도

CSS

css

SASS

001

2y

버튼에 타입을 쓰는 이유 (button type="button")

프롤로그
<button type="button">

가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요.
"아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람"
그러고보면 비슷하게 타입을 명시하는 <

Markup

000