개발이야기 (10) 썸네일형 리스트형 TypeScript에서 객체에서 Key로 String을 쓰지 못하는 이유 ( String과 String Literal ) 객체의 Key가 String이 아니라고? TypeScript를 처음 쓰면 익숙하지 않은 불편한 상황들을 만나게 될 때가 종종 생긴다. 평소처럼 코딩하면 생기는 붉은 줄들을 볼 수 있다. 이번에 만난 문제 또한 그렇다. Element implicitly has an 'any' type because expression of type 'string' can't be used to index type TypeScript는 기본적으로 객체의 프로퍼티를 읽을 때, string타입의 key 사용을 허용하지 않는다는 문구의 등장. 나는 분명 JavaScript의 객체의 키값은 Map이 아닌 경우에는 무조건 String만 된다고 알고있었는데.. 이게 무슨 상황? 이런 현상은 단지 이게 TypeScript라서 그렇다는 .. Duplicate atom key 에러 메시지 없애기 (Next.js) https://recoiljs.org/blog/2022/10/11/recoil-0.7.6-release/ Recoil 0.7.6 | Recoil - Expose flag to disable "duplicate atom key" checking / logging, as it was too noisy in environments such as NextJS or some dev environments using Fast Refresh. (#733, #2020, #2046) recoiljs.org 위는 해당 오류 공식 문서 내용이다. next.js에서 recoil을 쓰다보면 만나는 고질적인 문제. Duplicate atom key "". This is a FATAL ERROR in production. But .. next.js에서 chatGPT api 요청 보내기 ( express.js로 서버 열기 ) 이번 프로젝트에서 chatGPT를 활용해보려고 했다. 제공해주는 API가 있었기 때문에 그냥 요청 보내서 답 받는 형식으로 하면 굉장히 많은 프로젝트가 가능할 것 같았다! 난 게임파인더에서 사용했다. 아래는 내 깃헙 링크 https://github.com/mayo516/-GameFinder GitHub - mayo516/-GameFinder: 맨날 무슨 게임할지 고민하고 추천 요청 글 쓰러 다니는 게이머들의 소중 맨날 무슨 게임할지 고민하고 추천 요청 글 쓰러 다니는 게이머들의 소중한 시간을 아끼기 위해서 만든 페이지 - GitHub - mayo516/-GameFinder: 맨날 무슨 게임할지 고민하고 추천 요청 글 쓰러 다니는 github.com API 문서를 읽으면서 문서를 읽으면서 음? 하는 생각이.. 학습 프레임을 쓰자 [프론트엔드 개발자 취준기] 최근 왜 이렇게 초조하고 불안한지 생각해봤다. 우선 첫번째로, 6월까지 데드라인을 그어놓고 취업을 하려다 보니 초조한 듯 하다. 정작 6월된다고 내 세상이 망하지 않는데... 좀 마음의 여유를 가져야 겠다. 그때가서 돈 없고 그러면 아르바이트 하면 되지! 두번째로, 실행프레임에 갇혀있어서 인 것 같다. 최근 도서관에서 책을 고르다가 함께자라기 책을 발견했다. 읽는데.. 멋사하면서 북스터디 할 걸.. 이라는 생각이 들었다. 이렇게 좋은 책을 다 끝나고서야 알게되다니... ㅠ 특히 오늘 할 얘기인 학습프레임과 실행프레임에 관한 내용은 굉장히 인상적이었다. 학습프레임은 현재 주어진 과업이 내가 얼마나 얼마나 배우느냐를 여기게 되는 틀이고, 실행프레임은 현재 주어진 과업이 뭔자 좋은 성과를 내는 걸로 생각하는 .. next.js에서 순수 css로 reset css하기 next.js 도입하고 css reset 부터 시키려고 했는데 잠깐 애먹었던 부분을 공유하면서 누군가의 서치에 걸리길.. 바래본다 처음엔 page.tsx에 넣어보고 head.tsx에도 넣어봤는데 계속 reset 상태가 덮어씌여지거나 에러가 났다 next js 파일이 어떤 순서로 로드 되는진 모르지만 위치 문제인 것 같았다 . 결론적으로 layout.tsx에 다음과 같이 추가해주면 순수 css 파일로 reset할 수 있다. 슬럼프 회고 | 잊지 말아야 할 경험 번아웃? 슬럼프? 멋사도 이제 막바지를 향해 달리고 있다. 벌써 두달도 안남았다는게 ... 놀랍다. 요즘 나는 내 일과를 수업 시간엔 리액트를 배우고 다른 시간에는 우테코 프리코스, 인강, 데브 매칭등 다양한 활동을 하면서 채우고 있었다.약간의 기대와 열정으로 일을 많이 벌렸다. 어느 하나 놓치고 싶지 않았는데 타이밍이 기막히게 슬럼프가 왔다. ^^ 게더 타운에 잘 들어가지도 않게 되고 잔디도 숭숭 뚫렸다. 블로그는 말해뭐해. 몇 주치 회고를 밀렸다. 슬럼프인지 번아웃인지 모를 이 복병을 만나고, 나는 늘어져 있을 수만은 없었다. 코딩하면서 시간 가는줄 몰랐던 때가 꿈이었나 싶을 정도로 무기력했지만.. 누워서라도 왜 이러지? 라는 생각을 계속 했다. '빨리 해결을 해야 이 소중한 시간을 낭비하지 않을텐데.. GitHub 오거나이저..?가 뭔데? GitHub로 협업하기! 깃헙 organization(단체) 만들기 회고조원들이랑 자바스크립트30을 같이 페어프로그래밍 해보기로 했다. 페어 프로그래밍도 장단점이 존재하겠지만 한 번 경험해 보는 차원에서 도전! 그래서 페어프로그래밍 날만을 기다리고 있는데... 문득 든 생각이 그럼 깃헙으로 처음 협업 하게 되는건가??? 싶어서 약간 설렜다. 레포는 어떻게 관리하지..? 생각하다가 오거나이저 organization(단체) 이라고 공용 계정? 단체를 만들 수 있다고 들었다. 어렵지 않아보여서 내가 만들어보기로 했다! 오른쪽 위에 + 버튼을 눌러준다 여러 가지 플랜이 있는데 나는 무료! 단체 이름하고 이메일을 써준다. 갑자기 사람임을 확인하려고 나선은하를 찾으라고 한다. 나선은하가 뭐였지? 이렇게 생긴걸 고르시면 됩니다 ^^.. 화면에서는 저 빨간 동그라미 친 애다 next를.. 타입스크립트에서 const / let 을 컴파일하면 결과로 var가 나오는 이유 타입스크립트를 호기심에 써보거나 플레이그라운드에서 잠깐씩 써보다가 npm으로 설치를 하고 사용하려 하면 마주칠 수 있는 문제가 있다. 바로 컴파일시 나오는 결과다. 실제로 내가 프로젝트에 타입스크립트를 적용해 보려고 하면서 마주친 문제였고, 너무 당황스러웠던 기억이 있다. 다음과 같은 코드를 타입스크립트에 작성하여서 컴파일 해 보면 어떻게 될까? 터미널에 다음과 같이 치면 컴파일 해준다. 타입스크립트를 컴파일한 js 파일이 생성 되었고 이 곳에 들어가보면... ????? 처음엔 너무 당황스러웠다. var는 지양한다고 배웠는데 var로 바뀐다니. 그냥 쓰는건 아닌 것 같아서 이유를 찾아보게 되었다. 이렇게 이유는TypeScript 컴파일 타겟 자바스크립트 기본 버전이 ES3이기 때문이다. 만약, 자바스크립.. 이전 1 2 다음
