본문 바로가기

🌈 타미노트8

VS Code에서 ChatGPT 사용하기 (CodeGPT) VS code에서 chat GPT 사용하는 법 설정 방법 1. chatGPT 가입하기 https://platform.openai.com/overview OpenAI API An API for accessing new AI models developed by OpenAI platform.openai.com 2. API keys 생성 3. VS Code 익스텐션에서 Code GPT 설치 4. Code GPT에 API Keys 설정 4-1) cmd + shift + p 4-2) 세팅 입력 CodeGPT: Set API KEY 4-3) 발급받은 API key 입력 🥳 사용할 준비 완료! 주의할 점 참고로 특정 사용량 까지만 무료이고 그 이후에는 과금이 되는데 아래 페이지에서 확인할 수 있다. https://pl.. 2023. 3. 10.

프론트 주니어 2022 상반기 회고 벌써 여름이라니! 내가 프론트 개발자 주니어라니! 벌써 입사한지 약 1년이 되어간다. 그간 많은 변화가 있었지만 정리가 너무 안되어 있어 쓰는 글✏️ 목차 | 신규 서비스 오픈 ⚙️ 기술적인 고민들 웹 앱간 interface 정리 및 처리 크로스 브라우징 이슈 react-query 도입 🙏 협업의 고민 | 코드스쿼드 프론트엔드 리뷰어 | 개발 기초 다지기 🍿 출퇴근길에 보는 유튜브 모음 📒 모자스 다시 읽기 | 건강한 마음과 몸 만들기 🏋️ 습관적 헬스 🥜 심심풀이 땅콩 독서 🚀 신규 서비스 오픈 지난 달에 webview 신규 서비스를 오픈했다. 중고거래에 필요한 노하우나 관련 지식에 대해 소개하는 커뮤니티형 서비스였는데 댓글 기능과 2depth의 카테고리 22종이 포함된 6페이지 정도의 웹앱 프로젝트였.. 2022. 7. 4.

input 관련 이벤트 파헤치기 - input onChange onKeyUp onKeydown 회사에서 value에 따라 style이 변경해야 하는 기능을 가진 input을 만들어야 했는데, input event를 활용해서 해당 문제를 해결할 수 있었는데요. 정확히 왜 해결되었는지 원론적으로 접근해보고 싶어서 공부한 내용을 적었습니다. input event에 대한 내용은 김맥스 기술 블로그- input 요소 관련 키보드 이벤트 총정리 를 활용했는데 정말 정리가 너무 잘되어있습니다. 김맥스님 감사해요❤️ 사용 기술 스택 React 에 antd textarea사용 code sand box 예시에서는 일반 input과 textarea에 이벤트를 걸어보았습니다. input의 이벤트 onBlur 요소에 focus가 헤재되었을 때 발생하는 이벤트 onFocus 요소에 focus시 발생하는 이벤트 onKeyP.. 2022. 6. 1.

프론트엔드 입사 6개월 회고! 취업한지 벌써 6개월이 되었다. 시간은 정말 쏜살같이 흘러갔고 그 과정에도 많은 변화가 있었다. 내가 경험한 것들과 현재 생각, 그리고 앞으로의 다짐을 적을 예정! 처음 입시하고 나선, 우리 팀 너무 좋아😎 친구들이 3개월은 있어봐야 안다고 우려했지만 6개월이 된 지금도 나는 좋다. 나는 인턴으로 입사했다, 사실 정규직 전환을 크게 염두에 두고 들어간건 아니었고 가장 중요하게 여겼던 가치는 성장. 팀원은 적지도 많지도 않았는데, 선임같은 두 분이 계셨다. 내가 들어갈때쯤 메인 개편 건이 있었고, 그로 인해 신규 서비스에 참여하게 되었다. 타입스크립트 ,리코일 등 어떤 기술스택을 쓸건지 치열하게 고민하고 선정했다. 들어오자마자 모두가 그렇듯이 2주는 실무에 투입되지 않고 코드 파악만 했었는데, 일단 나는 .. 2022. 4. 12.

티스토리 다크모드 적용하기 - by 다크모드 버튼 드디어 미뤄왔던 나의 Tami.zip 블로그 다크모드 버튼을 만들었다. 미뤄왔던 이유는 크게 2가지 1. 사용자 테마에 따른 다크모드 지원 자료만 많음 -> 내가 원하는건 버튼을 통한 다크모드! 2. 티스토리는 배경을 바꾼 후에 필요한 CSS를 일일이 잡아서 바꿔줘야 함 하지만, 아늑한 밤에 킨 나의 블로그는 항상 아이어택을 선사했기 때문에 바꾸기로 결심했고 여러 시행착오를 겪었던 만큼 상세하게 어디에 어떤 코드를 넣으면 되는지 까지 설명하려 한다. 다크모드 버튼을 생성하는 과정에는 🔗다크 모드 라이트 모드 토글 스위치 기능 블로그를 참고했다. 다크모드를 설정하는 걸 설명하는 다양한 블로그들이 있었지만, 해당 블로그만큼 정확하게 내가 원하는 것이 없었느데, 다시 한번 해당 필자에게 감사의 말씀 드립니다... 2022. 2. 3.

프론트 스타터 2021회고 - 어쨋든 frontEND! 시작하자면 벌써 2022년 1월이 되었고, 사람 일은 정말 모르는 거다! 일단 현재는 프론트엔드 BE를 좀 할 수도 있는 직무로 취업했고, 전부터 계속 쓰고 싶었던 회고를 이제서야 쓴다. 내가 어떻게 취업하게 되었는지 모르겠지만 개발을 선택했던 과정(1) 그리고 지금 일하면서 느끼는 점과 앞으로의 목표들(2)을 써보려고 한다. 개발자로 돌아돌아도라간길 🎒이것저것 해보기 개발공부는 올해 21년 1월 시작되었다.(?) 나는 전자공학을 전공했지만 전자를 좋아하진 않았다. 근데 코딩은 뭔가 잘하는 사람만 해야할 것 같았다. 두 가지 사이에서 갈팡질팡 하는 사이에 4년이 지났고 대외활동만 열심히 하고 적당히 좋은 성적과 함께 졸업의 위기가 찾아왔다. 나...난 몰라... 그리고 그냥 취업 준비 시작! 목표는 모름.. 2022. 1. 10.

협업하며 맞춰본 자그마한 컨벤션 모음 zip 코드를 구현하다 보면 정말 말도안되게 작은 일인데 정하지 않고 넘어가면 피곤한 눈엣가시같은 규칙들이 있다.. 프로젝트의 규모는 점점 커지는데.. 이런 것들을 눈감고 지나가니.. 눈덩이처럼 불어나기 때문에 단판을 지어야 한다! 같이 개발하며 맞추면 좋은 사소한 것들을 경험을 기반해 설명하고자 한다. 1. git commit 과 & PR 컨벤션 git convention git commit 시 유명한 prefix가 몇가지 있어서 알아서 사용하는 느낌이었다. 표준 prefix에서 팀이 사용할 몇가지만 명시하고, commit 정책을 디테일한 예시와 함께 정리했다. feature 새로운 기능에 대한 commit fix 수정에 관한 commit style 코드 스타일에 관한 commit refactor 코드 리팩토.. 2021. 12. 19.

TIL #1 빠르고 간편하게 React 로 InfiniteScroll (무한 스크롤) 구현하기 React로 InfiniteScroll을 하는 방법 2가지 onScroll 이벤트 Intersection Observer API onScroll과 그 한계 사용자의 scroll event를 계속 보며 페이지가 끝에 오는지를 판단하는 방법을 구현이다. 하지만 드르륵 스크롤 할. 때마다 이벤트가 발생하는 것이다. 크롬에다 이것만 쳐봐도 알 수 있다. window.addEventListener('scroll',()=>console.log('🌀')) 그렇다면 남은 것은 🥳 Intersection Observer API 타겟과 viewPort 사이의 intersection 변화를 비동기적으로 관찰하는 방법 LazyLoading Infinite-scroll 사용자 결과 여부에 따른 애니메이션 등에 사용된다. 여기서.. 2021. 7. 28.

이전 1 다음

티스토리툴바