전체 글
노마드코더 캐럿마켓 클론코딩 예약구매 완료!
프로그래밍을 처음 배우기 시작하면서부터 지금까지 쭉 함께하고 있는 노마드코더 Learning by doing을 통해 프로그래밍을 배울 수 있는 가장 좋은 사이트라고 생각한다. 새로운 기술을 배우고 -> 이 기술이 왜 필요한지, 왜 탄생했는지를 찾아보고 -> 혼자 여러 방면으로 연습해보는 일련의 과정이 나에게 참 잘 맞았다. 복습해야할 강의도 많고 수료해야할 챌린지도 많고, 이론에 대한 공부할 것도 너무 많지만, 중압감은 하나도 없다. 커리큘럼을 재밌게 구성한 니꼬쌤 덕이 아닐까!! 요 니꼬쌤이 이번에 15시간 이상 분량의 NextJS 강의를 만들었다 처음 바닐라 자바스크립트에 입문하며 후에 편리한(?) 리액트 프레임워크를 배우게 될 생각에 기대가 됐었는데, 마찬가지로 리액트를 처음 배우기 시작할때도 리액..
시맨틱 태그(semantic tag)의 중요성..
html5 이전과 다르게 html5에서는 시맨틱 태그를 사용해서 코드의 가독성을 높여 좀 더 읽기 쉽게 해준다. css코드가 길어지다보니, class 명을 붙이더라도 수많은 div 속에서 html 전체구조가 들어오지 않았다. E-Commerce UNIF Design & Development 2015 -> Present div div div div div... 나중엔 큰 섹션을 위한 div인지 섹션 속 div인지도 헷갈리기 쉬웠다. 니꼬쌤의 코드를 비교해보니 Event 잠비나이 Music Band 2015 → Present 🌸 Art News Someone launched a very interested product section, footer, aside 등 시맨틱 태그를 이용하고있다. div 연발이 ..
[리액트] React-hook-form
리액트에 내장된 hook만으로 컴포넌트 속 form을 검증하기 위해서는 const [toDo, setToDo] = useState(""); const [toDoError, setToDoError] = useState(""); const onChage = (event: React.FormEvent) => { const { currentTarget: { value }, } = event; setToDoError(""); setToDo(value); }; const onSubmit = (event: React.FormEvent) => { event.preventDefault(); if (toDo.length < 10) { return setToDoError("To Do Should Be Longer"); } ..
[리액트] Recoil - state management
REDUX? or RECOIL? -> Nico said, "Everytime you learn or use libraries, framworks and other skills, You MUST know why you need and use those." Because those are built to sort out things. State management의 필요성? 다크모드, 유저의 로그인 여부 등 리액트 앱의 각종 state를 일일이 부모/자식 컴포넌트까지 argument로 전달해준다면 수많은 interface를 생성하고 반영해주어야함. => global state(atoms)를 사용하면 이를 해결할 수 있음! const isDark = useRecoilValue(isDarkAtom); const..
맥북 액정닦이용 클리너 천 - 마이크로화이버 유리용 타월
노트북을 쓰다보면 액정이 너무 더러워진다. 첨엔 다이소에서 안경/렌즈 닦는 알콜스왑같이 생긴 애를 사왔는데, 나중에 알아보니 노트북에는 반사반지 등을 위해 특수 코팅이 되어있다'카더라' 맥북의 경우에는 스테인게이트라고 액정 코팅이 벗겨지는 이슈도 있었다. 그래서 노트북 갤러리 등을 통해 검색해보니 '유동 걸레'라고 부르는 차량용/유리용 클리너 천이 괜찮다고 하여 구입했다. 제품명은 이십이도 마이크로 화이버 슈퍼 클리너 로 기억한다. (광고X) 실제로 사용해보니 잘 닦인다. 말라붙은 얼룩 같은건 물을 아~~주 조금 묻혀 닦으니 잘 닦인다. 2,400원 주고 샀던것같은데 만족! 크기가 좀 크긴해도 요즘은 안경도 이걸로 닦는다.
[타입스크립트] 타입스크립트 기본개념 + 병합연산자
타입스크립트 자바스크립트의 확장판 자바스크립트는 타입시스템이 존재하지 않기에 변수에 여러 타입이 할당가능함 -> 변수에 잘못된 타입(값)이 할당 되었을 때, 코드를 실행해야만(=런타임 환경에서만) 에러가 발생했음을 알 수 있음 그러나 타입스크립트는 이러한 자바시스템에 강한 타입시스템을 적용해 코드 작성환경(컴파일 단계 혹은 이전)에서 에러를 확인할 수 있음 const plus = (a, b) => a + b 자바스크립트 const plus = (a:number, b:number) => a + b 타입스크립트 함수 인자들이 타입화되었음 실제론 저렇게 사용X. 컴포넌트 생성 후 prop 보내주면 된다. - 0. 인터페이스는 변수, 함수, 클래스에 타입 체크를 위해 사용 됨. 자바스크립트 리액트의 propTy..
[리액트] - styled component
1. props 활용 - 동일한 컴포넌트에 특정 prop에 다른값을 주고싶을때 const Box = styled.div` background-color: ${(props) => props.bgColor}; width: 100px; height: 100px; `; //inside of rendered component 2. extend 활용 - 이미 만들어진 컴포넌트를 확장하여 사용 const Box = styled.div` background-color: ${(props) => props.bgColor}; width: 100px; height: 100px; `; const Circle = styled(Box)` border-radius: 50px; `; 3. as - 컴포넌트 내 prop은 같되 html..
투자보다 암호화폐 투기에 열광하는 젊은 세대?
https://twitter.com/raoulgmi/status/1454612863776169984 Raoul Pal on Twitter “They value different things and there are more of them than you or I. It gets more extreme when you get to India or the Middle East, when everyone is under 30! Those societies are going to see seismic shifts.” twitter.com 현상을 포착하고 통찰로 풀어낸 Raoul Pal의 글. -
양산 황산공원 - 바람 쐬기 좋은 곳
황산공원이 너무 커서 피크닉을 목적으로 오는 사람은 강민호 야구장을 찍고 안쪽 주차장으로 들어오는게 좋다. 돗자리나 캠핑용 의자를 들고와서 그늘에 앉아서 쉬는분들이 많다. 한여름이나 겨울엔 힘들지만, 지금은 피크닉 가기 좋은 계절. 마실 것이나 간단한 간식류 챙겨 나오기 좋은 곳이다. 취사를 원하는 분은 바로 앞에 황산공원 캠핑장을 예약하는 게 좋다. 화장실은 공원 곳곳에 있지만 휴지가 없으니 챙겨가야함 ! 단점이라면 나무가 적어 넓은 공원 공간에 비해 그늘이 한정적이다. 쓰레기통이 없어 쓰레기를 직접 챙겨와야 한다....지만 화장실에 가면 항상 다른 이용객들이 버려놓은 쓰레기가 투기돼있음