230314(화)

🎄 성장일지 3.2

책 행복한 이기주의자(웨인 다이어)의 내용에 자극받아 시작하는 소박한 성장기록

살아있는 꽃과 죽은 꽃은 어떻게 구별하는가?
성장하고 있는 것이 살아 있는 것이다.
생명의 유일한 증거는 성장이다!

🌳 키워드 (1.0)
최대한 간단하게 정리, 추후에 보면서 스스로 설명
🍉 경험 위주로 (2.0)
단순 정보를 전달하기보다 무엇을 배웠고 어떻게 해결했는지 짧고 간단하게 작성
❄️ 정해진 템플릿에 맞춰서 (3.0)
키워드, 경험 모두 좋다. 다만 매일 작성하기로 마음 먹은만큼 핵심만 간결하게 정리할 수 있게 템플릿을 작성
(3.1) 230102부터 시작되는 학습에 관한 내용 추가
(3.2) 230313부터 좀더 경험, 감정 위주의 내용도 담기!

🔑 오늘의 키워드

git stash

• a 브랜치에서 b 브랜치를 따고 로컬에서만 b 브랜치에 변경 사항이 발생하면 a 브랜치로 스위치가 가능하다.
  • 이유: commit을 기준으로는 변경이 일어나지 않았고, 로컬에서 워킹 디렉토리에서만 변경이 있기 때문에 b에서의 변경사항 이 a로 그대로 가져가진다.
  • 이 때! stash 혹은 commit을 해서 변경사항을 반영할 수 있는데, 솔직히 커밋은 기능 단위로 하는 경우가 많기에 함부로 commit을 하기 애매하다.
  • 이 때 stash를 통해 최근 커밋 기준 다음 변경사항들을 따로 빼두는 것이다.
  • 그렇다면 언제 브랜치를 변경하기 전에 commit 혹은 stash를 하라는 에러가 발생할까?
  • a 브랜치에서 b 브랜치를 따고 b 브랜치에서 작업을 한 뒤 커밋을 한다. 그러고 나서 또다시 로컬(워킹 디렉토리)에서 작업을 하고 a로 옮기려고 하면 에러가 발생한다.
  • 이 때, stash로 변경사항을 잠깐 빼두든가 아니면 또다시 커밋을 해서 변경사항을 반영하고 옮기면 된다.

el.firstChild가 때로는 textNode로 뜨지 않을 때!(feat. 브라우저)

• 브라우저에서는 html 파일들의 요소들이 최적화되어 공백없이(textNode가 없이) 정리된다.
• 해서 firstChild로 textNode가 안찍히기도 한다!

템플릿 엔진이란?

• 템플릿 양식과 특정 데이터 모델에 따른 입력 자료를 합성하여 결과 문서를 출력하는 소프트웨어(또는 소프트웨어 컴포넌트). 그냥 템플릿 라이브러리라고 생각하면 된다.
• 지정된 템플릿 양식에 데이터가 합쳐져서 html 문서를 출력하는 소프트웨어 즉, 화면을 어떻게 만들지 도와주는 양식이다.
• 그저 이름을 템플릿 엔진이라고 붙여서 조금 헷갈린다.
• Handlebars, Mustache 등이 있다.(넓게 보면 react, vue 등도 템플릿 엔진이다.)

참고

• Git stash
• 템플릿 엔진
• 바닐라 익스트랙

📝 요약 및 하루 간단 회고

오늘 하면 떠오르는 것. typescript class component와 vanilla extract로 리펙토링해보겠다고 하루종일 끙끙거린 것과 git branch를 오가는데 헷갈리는 개념이 생겨서 stash 열심히 공부한 것! 뭔가 딱 눈에 보이는 결과물이 없지만…(그래도 dim처리하는 컴포넌트는 하나 만들었다 ㅠ) 뭔가 얻은 게 많은 느낌이다. 남은 시간 동안 최대한 html, css, ts로 구성되어있던 웹 페이지를 component로 나누고 vanilla extract을 적용해볼 생각인데 부디 잘 됐으면 좋겠다. 아니 그냥 무조건 될 것이다!!!

오늘의 잘한 점

• git stash 를 정말 활용할 수 있게 되었다!!!
• 새로운 것(vanilla extract, ts component)을 시도한 것
• 열심히 공식문서 보면서 끙끙거려본 것

오늘의 아쉬운 점

• 나름 열심히 한다고 했는데, 집중력이 아주 좋진 않았던 거 같다. 🧐