🐤 개발하는 참새 🌞

Week 3 Recap as a Frontend Intern @Daangn 2주차 금요일에, 첫 월급이 들어왔다.난생처음으로 십일조도 내고, 부모님과 조부모님들께 용돈도 보내드리고, 주말엔 가족들과 좋은 곳에서 식사를 할 수 있었다.그렇게 점점 컨디션을 회복할 수 있었던 것 같다. 이게 그 금융치료인가..? 3주차에는 첫 문화의 날이 있었고, 버디가 3일간 출장을 다녀오시면서 유난히 빠르게 시간이 흘렀다.팀 싱크는 노션을 통해 비동기로 맞췄고, 버디는 틈틈이 리뷰와 코멘트를 남겨주시며 지속적으로 서포트해주셨다.다음 주는 연휴가 이틀이나 있어 자칫 루즈해질 수 있는 주간일 듯하지만, 그럴수록 더 오랫동안 책상 앞에 머물며 집중해보기로 마음먹었다. 이 주의 키워드 별 회고! 작은 성공 | 나는 평소 하고 싶은 일과 금방 끝날 일을 앞에 두었을 때, 전자부터 시작하는 편이다..

Week 2 Recap as a Frontend Intern @Daangn 1주차에 매일 회고를 하며, 멘탈과 의욕 관리가 중요할 것이라고 예상했다. 바로 전 회고에도 적은 것처럼, 컨디션에 무리가 가지 않는 선에서, 나의 페이스를 빨리 찾은 뒤에 점차 올리는 게 중요하기 때문이다. 그래서 매일 목표 달성 지수와 기분 의욕 지수를 점수로 메기고, 그래프로 관리하기 시작했다. 이게 생각보다 효과가 있다고 느껴진게, 점수로 오늘 하루를 평가하려고 하니 오히려 이성적으로 하루를 되돌아볼 수 있었다. 지나치게 자책을 한다거나 뿌듯해하는 등의 업다운이 없는 게 좋다고 생각되서 꽤나 효과를 봤다고 생각한다. 오늘의 잘한 점과 개선할 점 등을 적은 뒤에 점수를 산정했는데, 생각보다 점수가 낮다고 해서 '오늘 하루를 망쳤어!' 라는 생각도 안들고, 그저 오늘의 나를 냉정하게 바라보고, 내일..

Week 1 Recap as a Frontend Intern @Daangn 당근 알바(Local Jobs)팀에서 프로덕트 엔지니어, 그 중에서도 프론트엔드 인턴으로 일하게 되었다. 사실 당근 알바팀의 프론트엔드 인턴 포지션은 내가 7개월 전, 학교다니며 준비가 부족한 상태로 처음으로 면접을 봤던 포지션이기도 하다. 이전부터 당근과 잘 어울린다는 말을 많이 들었기에 가장 가고 싶은 회사가 당근이었다. 그 중에서도 나와 가장 Fit 하다고 느낀 당근 알바팀이 나의 첫번째이자 마지막 채용 프로세스라니! 나만 느끼는 운명적인 이야기 ..~ 다른 회사에서도 합격 연락을 받았지만 가지 않았을 정도로 당근은, 그 중에서도 알바팀은 너무나 함께하고 싶은 팀이었다. 프로덕트에 진심인 엔지니어는 어떻게 일할까? ① | 당근 블로그당근 팀이 일하는 문화와 방식을 소개해요.about.da..

타입챌린지 [쉬움] 난이도 중 인사이트 정리 ✅ 1. 14 - First문제: 배열의 첫 번째 요소의 타입을 추출하라.type arr1 = ['a', 'b', 'c']type arr2 = [3, 2, 1]type head1 = First // expected to be 'a'type head2 = First // expected to be 3type cases = [ Expect, 3>>, Expect 123, { a: string }]>, () => 123>>, Expect, never>>, Expect, undefined>>,]type errors = [ // @ts-expect-error First, // @ts-expect-error First,]type First = T extends [] ? never : T[0];빈 배열..

TypeScript의 모듈 해석 캐싱 메커니즘 들어가며TypeScript를 사용하다가 예상치 못한 모듈 해석 관련 문제를 마주치게 되었습니다. .d.ts 파일의 위치를 변경했다가 다시 원래대로 되돌렸을 때, 이전에는 에러가 발생했는데 갑자기 정상적으로 동작하는 경우가 있습니다. 찾아보니 이는 TypeScript의 모듈 해석 캐싱 메커니즘 때문이라고 합니다. 이번 포스트에서는 이 메커니즘에 대해 자세히 알아보고, 실제 경험했던 문제와 해결 과정을 공유하겠습니다.모듈 해석이란?모듈 해석(Module Resolution)은 컴파일러가 import가 무엇을 참조하는지 알아내기 위해 사용하는 프로세스입니다. 예를 들어:import { a } from "moduleA";이런 import 문에서 컴파일러는 a의 모든 사용을 검사하기 위해 moduleA가 정확히 ..

Promise.all()과 비동기 처리 - 콘솔 로그만 추가했는데 버그가 고쳐졌다? 🤔 문제 상황React 프로젝트에서 Firebase Firestore를 사용하여 사용자 정보를 가져오는 과정에서 재미있는 현상을 발견했습니다. 시를 완료한 사용자들의 닉네임을 표시하는 기능을 구현하던 중, 몇몇 시에서 첫 번째 사용자의 닉네임이 표시되지 않는 문제가 있었습니다. 문제 해결을 위해 콘솔 로그를 추가했는데, 놀랍게도 로그를 추가하는 것만으로 문제가 해결되었습니다! 🔍 원인 분석원래 코드는 다음과 같았습니다:const fetchUserNicknames = async (userIds: string\[\]) => { if (!userIds.length) return; try { const nicknames: { \[key: string\]: string } = {}; ..

CursorAI + MCP 로 생산성 100배 부스트하기 (Sequential Thinking과 TalkToFigma) CursorAI와 MCP(Model Context Protocol)는 개발자에게 강력한 도구로 세상이 시끄럽다. CursorAI 에 크게 놀랐는데, MCP 를 결합하면 더 엄청나다는 이야기를 유튜브에서 보고 몇가지 활용해보았다. CursorAI와 MCP의 소개CursorAI는 인공지능을 활용하여 코드 작성, 디버깅, 최적화 등을 지원하는 도구로, 개발자의 생산성을 크게 향상시킨다. MCP는 다양한 플랫폼과의 통합을 가능하게 하여, 개발자가 여러 도구를 유기적으로 활용할 수 있도록 돕는다.내가 사용해본 MCP 1 - Sequential Thinking 🧠Sequential Thinking은 복잡한 문제를 단계별로 접근하여 해결하는 방법론으로, 개발 과정에서의 논리적 사고를 강화한다. 단계별로 명확하게 ..

Cursor AI 등 .. 코딩할 때 AI 툴을 사용하며 느낀 개인적인 생각, 부작용 AI 코딩의 위험성오늘 실제 프로젝트 마이그레이션을 진행하면서 깨달은 중요한 점이 있습니다.코드에 대한 깊은 이해 없이 AI를 사용하는 것은 매우 위험할 수 있다는 사실입니다.기존 코드는 제가 직접 기능을 구상하고, 하나씩 함수를 작성한, 그야말로 '이해도가 높은 코드' 였습니다. 오늘 cursorAI 를 사용하여 타입스크립트로 마이그레이션하고, 기존의 Redux 적용 범위를 확장하면서 주의하고, 다음부턴 어떻게 해야할 지 회고가 필요할 것 같아서 이 글을 작성하게 되었습니다. 1. 왜 위험한가?첫번째로 기능 손상의 위험이 큽니다. AI가 코드의 전체적인 맥락을 완벽히 이해하지 못하는 경우가 생각보다 많았습니다. 그래서 기존 기능의 의도나 로직을 보존하지 못한 것을 뒤늦게 발견하기도 했습니다. 두번째로..

리액트 자바스크립트 -> 타입스크립트로 마이그레이션 하기! 1. 컴포넌트 선언 방식// 기존 JSconst Dashboard = () => { // ...}// 변환된 TSXconst Dashboard: React.FC = () => { // ...}React.FC (Function Component) 타입을 명시적으로 선언하여 TypeScript에게 이 컴포넌트가 React 컴포넌트임을 알려준다이렇게 하면 컴포넌트의 props 타입을 자동으로 추론할 수 있으며, React 관련 타입 체크도 가능하다최신 React에서는 React.FC 대신 React.ComponentType을 사용하는 경우도 있다 2. Props 타입 정의// 기존 JSconst CategoryEditor = ({ onClose }) => { // ...}// 변환된 TSXinterfac..

이전 1 2 3 4 ··· 11 다음

라이브러리 브랜드 그룹 | 🐤 개발하는 참새 🌞

티스토리툴바