한 박자 느린 박치 이벤트 keydown에 대하여 이 문제를 발견하게 된 것은 구글 폰트 사이트와 같이 인풋에서 타이핑을 치면 각 폰트 박스에 타이핑 치는 값이 출력되는 것을 만들어보고 싶었다. 만들어본 결과물이다. 처음에 만들때는 그저 인풋 값에 keydown 이벤트를 주고 리덕스(vanilla js에서 redux 사용해보기 연습 중이었음)를 사용해 값을 바꿔주면 될 것이라 생각했다. 하지만 동작은 내 기대와는 전혀 다르게 작동했다. 아니 뭔데요..저 6까지 쳤잖아요.. 근데 왜 5까지 밖에 안 나오냐고요;; 그래서 도대체 뭐가 문제인지 해결 방법을 찾던 중 setTimeout을 준다면 해결이 된다는 글을 봤다. setTimeout을 주니까 그제서야 박자를 맞추는 keydown 이벤트 후,,, 이 말고도 keydown 이벤트가 아닌 input 이벤트로.. 멋사 프론트엔드 스쿨 10, 11주차 회고 제주 연사를 잘 마무리했다. 너무 재밌고 좋은 경험이었다. 사실 10주 차 회고는 제주 연사 글로 퉁치기 가능 ㅎㅎ 이후에는 아무 생각 없이 쭉 쉬었다. 잘 쉬는 것도 어렵다는데 이번엔 정말 푹 쉬었던 것 같다. 잠도 몰아잤고, 넷플릭스도 몰아봤다. 이후 11주차에는 사실 적응하기가 힘들었다. 하지만 드디어 기다리던 리액트가 시작됐고, 리액트 러버인 나는 그냥 행복사 ㅎㅎㅎ 최고다 리액트, 스타일 컴포넌트!! 알면 알수록 재밌다. 프로젝트 팀이 발표가 됐다. 사실 긴 방학이 끝나고, 첫날에 시험을 봤는데 진짜 실수를 너무 많이 해서 당황했다. 문제 6개 틀림..ㅎ 그래도 좋은 팀원들과 만났으니 그거면 됐다. 최선을 다해서 2인분 3인분 이상을 해내고 싶다. Last Week 성공 실패 몰입 이론 점수(1.. React v18에선 이제 안써요!!"ReactDOM.render is no longer supported in React 18" 현재 기준 리액트는 Version 18.1.0이 공개돼 있다. CRA(create-react-app)로 React 프로젝트를 생성하면 18.1.0 버전이 다운로드하여진다. 하지만 버전이 달라지면 항상 이전 버전에서 더 이상 사용하지 않는 것들이 발생하게 되는데, 18.0.0 버전부터 ReactDOM.render을 사용하지 않는다는 에러가 나온다. 사실 아직 나는 한 번도 보지 못했는데, 동기분의 에러 메시지를 통해 처음 알게 되었다. 17 버전 이하를 사용하다 18 버전으로 버전업을 한다고 했을 때 만날 수 있는 에러라고 생각해서 정리를 하려고 마음을 먹었다. ReactDOM.render는 index.js 파일에서 찾아볼 수 있는데, 우리가 흔히 보던 React의 index.js 내부 내용이다.(조금 간.. 순수 함수와 비순수 함수 🚀 순수 함수? 비순수 함수? 함수라면 그냥 함수인 거지 순수 함수는 뭐고 비순수 함수는 뭐일까? 순수 함수와 비순수 함수에 대해 얘기하기 이전에 함수형 프로그래밍에 대해 얘기해보려고 한다. 자바스크립트는 주로 객체지향 프로그래밍과 함수형 프로그래밍으로 나뉘는데 객체가 기본이 되는 프로그래밍을 객체지향 프로그래밍이라고 하고, 함수형 프로그래밍은 말 그대로 함수가 기본이 되는 프로그래밍을 의미한다. 왜 갑자기 함수형 프로그래밍 이야기가 나왔느냐!? 궁금할 수 있다. 함수형 프로그래밍을 사용하는 이유가 순수 함수를 통해 부수 효과를 최대한 억제하여 오류를 피하고 프로그램의 안정성을 높이기 위해 사용하기 때문이다. 그래서 순수 함수는 뭐고 부수효과는 뭔데? 바로 알아보자 순수 함수 & 비순수 함수(feat. .. 제주도 웹 컨퍼런스 후기 제주 웹 컨퍼런스에 참여하고 왔습니다. 진짜 너무 재밌고 뜻깊었던 시간이었어요. 우선 제주도 첫날에는 컨퍼런스 전날에 도착해 호준님과의 대화 시간을 가졌습니다. 호준님과의 대화 이후 제코베에 취업하고 싶다는 생각이 들었습니다. 제 코베의 운영 방식과 복지, 호준님의 직원들을 생각하는 마음까지 제코베에 대해 많은 것을 들었던 시간이었습니다. 코딩 교육에 대한 저의 생각을 조금이나마 정리할 수 있었던 시간이었습니다. 둘째날부터 본격적인 컨퍼런스가 시작됐습니다. 콘퍼런스 첫날에는 연사자가 아닌 참가자로 각종 세션들을 들었습니다. 기억에 남는 건 역시 같은 멋사 분들의 비 온 뒤에 단단해지는 땅처럼(비단땅) 연사와 개발자의 품격 고승원 님의 개발자 콘텐츠 크리에이터 였습니다. 비단땅 팀의 연사는 개발을 시작하는.. 멋사 프론트엔드 스쿨 9주차 회고 9주 차에 큰 이벤트들은, JS이론이 끝이 났다는 점 벌써 JS가 끝이라니 흑흑.. 아직 많이 부족한 것 같은데 벌써 끝이 났다. 제대로 복습하면서 React도 잘 따라갈 수 있도록 해야지 파이팅 김영하 작가님 책을 다 읽었다. 정말 너무너무 재밌고 책도 잘 읽혀서 금방 읽었다. 강추한다. '작별 인사' 리뷰 : https://mingstone.tistory.com/38 1분 코딩님의 three.js, gsap 강의를 들었다. 들으면서 와 이런 거였구나 뭔가 어렵기만 하고 멀어 보이기만 했던 3d를 이런 식으로 표현을 하는 거였구나 했다. 지금은 js와 react 기본에 좀 집중해서 공부하겠지만, 나중에 나의 다른 경쟁력을 위해 더 공부해서 사용해봐야겠다. 진짜 알기 쉽게 설명해주심 최고 ㅜㅜ 수진님의 .. 작별 인사 📚 작별인사를 읽고 만남은 쉽고 이별은 어려워 한 번쯤은 들어봤을 노래 가사이다. 사실 유퀴즈에서 먼저 김영하 작가님이 '이별을 하기 때문에 슬프다고 한다.'라는 말을 들어서 그런지 더욱더 이 가사가 생각났다. 초기 불교의 유명한 경전 법화경에 나오는 말이 있다. 회자정리(會者定離) 거자필반(去者必返)이라는 말인데 익숙할지도 모르겠다. 모든 만남에는 헤어짐이 있고, 헤어짐 이후에는 또 만남이 있다는 의미로 해석이 되기도 하지만, 그 본연의 뜻을 해석해보자면 만난 사람은 헤어짐이 정해져 있고, 가버린 사람은 반드시 돌아온다는 뜻이다. 우리는 만남이 시작되면 이별은 정해져 있다. 좋지 않은 이별이던 그냥 다른사람이 다 하는 이별이던, 언젠가는 이별을 하기 마련이다. 전 세계에 있는 사람 중 당신을 만나 친구.. 멋사 프론트엔드 스쿨 50% 진행 기념 회고 7주차 회고 쓴 지 얼마나 지났다고, 벌써 8주차 회고라니 시간이 너무나도 빨리 지나가고 멋사에 들어온지 2달이 지났다. 2달 전의 나와 비교해 봤을 때 너무나도 많은 변화가 있었다. 첫째로는 공부하는 습관이 길러지고, 공부가 재밌어진 것 정말 이상하게 어제 친구들과 오랜만에 게임을 했는데 오히려 게임을 하니까 머리가 아팠다. 주말에 쉬고 싶어서 오랜만에 같이 게임하자는 약속을 잡았는데, 약속이라서 계속한 것이지 사실은 중간에 나가고 싶었다. 공부를 하고 싶었던 것 같다. 내가 하고싶은 공부를 하니까 너무 행복하다. 뭔가를 몰라도 이것을 알아내고 공부해서 습득하면 정말 그 순간순간 내가 성장하는 기분이 들어서 너무 좋다. 두번째는 회고를 통한 반성이 일상이 됐다. 주간 회고를 작성하고 있는데 팀 회고에서.. 멋사 프론트엔드 스쿨 8주차 회고 8주 차의 큰 이벤트는 바로 이력서 대회 최우수상 받았다. 진짜 감격 생각지도 못한 상이라 너무너무 기분 좋았다 ㅎㅎㅎ 감사합니다요~~ 테일윈드로만 만든 이력서인데 테일윈드로만 만들다 보니 내가 생각한 대로 레이아웃을 짜기에는 좀 어려웠다. 그래도 혹시나 궁금할 수 있으니까~ 링크는 남겨두고 가야지.. 이력서 링크 : https://alstjr5949.github.io/resumeContest/ (참고 : 내 사진 나옴) 그리고 인터뷰도 찍고 피크닉도 다녀왔다.. 대전촌놈의 서울 나들이란 절레절레 너무 힘들었지만 그래도 동기분들을 직접 만나서 행복했던 시간이었다 ㅎㅅㅎ 인터뷰는 7월 중으로 나옴 만관부~ 오늘 처음으로 몰입이론 표 사용해서 하는 회고다. 한층 더 발전한 회고가 되기를 ㅎㅎ Last Wee.. 프로토타입 체인 🚀 프로토타입 체인 스코프도 체인이 있듯 프로토타입 역시 체인이 있다. 프로토타입 체인에 대해 알아보자. 먼저 Person이라는 생성자 함수를 만들고, Person의 프로토타입 메서드 sayHi를 만든다. 이후 minseok을 new Person을 통해 생성한다. 이후 콘솔창에 minseok을 찍어보면 두개의 [[Prototype]]이 있는 것을 볼 수 있다. 이것이 프로토타입 체인이 이뤄진 것인데 아직은 이해하기 힘들 것이다. 잘 기억해두었다가 다시 살펴보자. 이제 콘솔 창에 Person.prototype을 쳐보면 Person이 갖고 있는 sayHi와 constructor 프로토타입 메서드와 또 [[Prototype]]이 있다. 어떤가?? 어디서 많이 본 것 같지 않나?? ㅎㅎ 이제 마지막으로 Obje.. 멋사 프론트엔드 스쿨 7주차 회고 7주 차는 정말 정신없이 지나갔다. 5월 20일에 있을 인터뷰 촬영과 5월 말까지 집필해야 할 타입 스크립트 책, 6월 3일 제주도 웹 콘퍼런스 연사를 위한 공부, 그리고 기훈 님의 프로젝트까지 진짜 너무너무 할 일이 많았던 한 주였다. 정말 부끄럽게도 너무 정신없이 살아서 특별한 일이 없었던 것 같다. 사실은 조금 힘이 없긴합니다 후.. 팀 회고에서도 설정한 목표를 전부 달성하지 못했다. 이번주의 목표가 난이도가 어렵거나 나의 실력이 부족한 것은 아니었다. 단지 중요도에 따른 목표 설정을 했어야 하는데, 그렇게 하지 못한 것 매우 잘못된 목표 설정이었다. 그로 인해 발생한 처참한 결과.. 함께 살펴보시죠. 아!! 다음 주부터는 어제 마침 함께 자라기를 다 읽었고, 제주도 연사는 함께 자라기를 읽고 나서.. 멋사 프론트엔드 스쿨 5,6주차 회고 절대로 5주 차 쓴다,, 쓴다 하다가 밀려서 5,6주 차 한 번에 쓰는 거 아님;; 아니 아니라고요!! ㅋㅋㅋ 시간이 너무 빨리 지나간다. 매번 회고를 쓰면서 하는 말이지만 정말 빨리빨리 지나간다. 6주 차인 이번 주는 어른이 날을 맞이해서 자바스크립트한테 뚜드려 맞고 있던 아기사자들을 구원해줄 휴식기를 가져다주었다. 감사해요.. 운영진님들.. 정말 세심하게 휴강일을 선정하셨더군요.. 정말 감사합니다 후 5주 차에는 부트스트랩과 금요일 보라님의 깃 특강으로 그냥 목성에 있는 외계인이랑 하이파이브 열라게 치고 옴 ㅋㅋㅋㅋㅋ 너무너무 어려워요 깃ㅜㅜㅜ 지옥에서 온 깃!! 물론 깃이 없던 시절은 더 지옥 같다는 의미긴 하지만,, 왠지 너무너무 어려워서 지옥에서 온 것 같다고 하는 것 같아요 ㅜㅜ 흑.. 그래도.. 이전 1 2 3 4 5 다음
