본문 바로가기

Frontend Dev

(140)
[원티드 프리온보딩 FE 챌린지 3월] React 실전 가이드: 면접 및 실무 기술 [원티드 프리온보딩 FE 챌린지 3월] React 실전 가이드: 면접 및 실무 기술 🗓️ 2024.03.04 ~ 2024.03.17 원티드에서 진행하는 프리온보딩 FE 챌린지 수강 후 정리한 글입니다. 👩🏻‍💻 [STUDY NOTE] ⭐️ 코스 둘러보기 - 4번의 코스에서 다루어 볼 이야기 • 1차 • web의 역사 (browser 렌더링, AJAX, DOM, Virtual DOM) • react 기본 기념 (render(), jsx, hooks) • 이력서 관련 팁 • 2차 redux-toolkit 상태관리 • 3차 현업 프로젝트에 적용하는 패턴 (project structure, error handling) • 4차 coding convention, 이력서 feedback 📚 노션에 정리한 스터디 노..
[원티드 프리온보딩 FE 챌린지 2월] 상황에 맞는 프론트엔드 개발 전략 이해하기 [원티드 프리온보딩 FE 챌린지 2월] 상황에 맞는 프론트엔드 개발 전략 이해하기 🗓️ 2024.02.05 ~ 2024.02.18 원티드에서 진행하는 프리온보딩 FE 챌린지 수강 후 정리한 글입니다. 👩🏻‍💻 [STUDY NOTE] ⭐️ 코스 둘러보기 - 4번의 코스에서 다루어 볼 이야기 • SPA의 원리를 배우고, 사용자 경험을 향상시키는 방법을 탐구합니다. • SSR과 CSR의 차이를 이해하고, 각각의 장단점을 비교합니다. • 웹으로도 앱처럼 사용가능한 PWA를 알아봅시다. • 브라우저가 아닌 데스크톱 환경에서 사용되는 애플리케이션을 구현하는 방법을 알아봅시다. 📚 노션에 정리한 스터디 노트 이번 스터디 노트는 비공개합니다. 🫢 제 방식으로 좀 더 정리된다면 공개하겠습니다! ► 챌린지 전, 🔥 목표 ..
[원티드 프리온보딩 FE 챌린지 1월] 포트폴리오 작성을 위한 리액트 프로젝트 고도화 [원티드 프리온보딩 FE 챌린지 1월] 포트폴리오 작성을 위한 리액트 프로젝트 고도화 🗓️ 2024.01.02 ~ 2024.01.15 원티드에서 진행하는 프리온보딩 FE 챌린지 수강 후 정리한 글입니다. 👩🏻‍💻 [STUDY NOTE] ⭐️ 코스 둘러보기 - 4번의 코스에서 다루어 볼 이야기 • 전역변수를 설정하는 기준과 방법 • 테스트코드를 활용한 효율적인 리팩토링 • 백엔드 코드를 수정할 수 없을때 프론트엔드가 할 수 있는 최적화방법 • 실전 리팩토링 📚 노션에 정리한 스터디 노트 1️⃣ 전역변수를 설정하는 기준과 방법 2️⃣ 테스트코드를 활용한 효율적인 리팩토링 3️⃣ 백엔드 코드를 수정할 수 없을때 프론트엔드가 할 수 있는 최적화방법 4️⃣ 실전 리팩토링 ► 챌린지 전, 🔥 목표 및 다짐 현재 취..
[Mini Project] 프론트엔드 과제테스트로 만난 Note-App 구현 과정 정리 (3) [Mini Project] Note-App 👩🏻‍💻 Github Repository https://github.com/sw2377/note-app 작업 기간 : 2024. 01. 09 ~ 2024. 01. 16 프론트엔드 채용 과제로 수행한 Note-App 구현 과정 (구현 중 에러사항 & 고민한 부분)을 정리한 글입니다. 🔗 시리즈 이어보기 Note-App 구현 과정 정리 (1) Note-App 구현 과정 정리 (2) 현재글 : Note-App 구현 과정 정리 (3) 📖 목차 1. 외부 타입정의 파일 만들기 2. 노트 삭제시 비동기 코드 작성하기 (async / await) 3. 반복되던 handleCreateNote 커스텀 훅으로 만들기 4. TypeScript의 Date 타입 5. vercel 배포..
[Mini Project] 프론트엔드 과제테스트로 만난 Note-App 구현 과정 정리 (2) [Mini Project] Note-App 👩🏻‍💻 Github Repository https://github.com/sw2377/note-app 작업 기간 : 2024. 01. 09 ~ 2024. 01. 16 프론트엔드 채용 과제로 수행한 Note-App 구현 과정 (구현 중 에러사항 & 고민한 부분)을 정리한 글입니다. 🔗 시리즈 이어보기 Note-App 구현 과정 정리 (1) 현재글 : Note-App 구현 과정 정리 (2) Note-App 구현 과정 정리 (3) 📖 목차 1. lexical text editor 사용하기 2. 헷갈렸던 부분 1, props type 정의 방법 3. 헷갈렸던 부분 2, JSX를 반환하지 않는 React component의 return null 4. 생각보다 어려웠던 ..
[Mini Project] 프론트엔드 과제테스트로 만난 Note-App 구현 과정 정리 (1) [Mini Project] Note-App 👩🏻‍💻 Github Repository https://github.com/sw2377/note-app 작업 기간 : 2024. 01. 09 ~ 2024. 01. 16 프론트엔드 채용 과제로 수행한 Note-App 구현 과정 (구현 중 에러사항 & 고민한 부분)을 정리한 글입니다. 🔗 시리즈 이어보기 현재글 : Note-App 구현 과정 정리 (1) Note-App 구현 과정 정리 (2) Note-App 구현 과정 정리 (3) 📖 목차 1. 기술 스택의 선택 (TypeScript, Styled-components를 사용한 이유) 2. 레이아웃 고민하기 3. Vite로 React + TypeScript 조합으로 프로젝트를 생성 후,main.tsx 파일의 docum..
[원티드 프리온보딩 FE 챌린지 12월] 실전 스킬: 비즈니스 로직 완전 정복 with React [원티드 프리온보딩 FE 챌린지 12월] 실전 스킬: 비즈니스 로직 완전 정복 with React 🗓️ 2023.12.04 ~ 2023.12.17 원티드에서 진행하는 프리온보딩 FE 챌린지 수강 후 정리한 글입니다. 이번 챌린지는 이해가 어려워, 후기만 남깁니다 🥲 👩🏻‍💻 [STUDY NOTE] ⭐️ 코스 둘러보기 - 4번의 코스에서 다루어 볼 이야기 • 컴포넌트가 복잡해지는 원인에 대해 고찰해보기 • 비즈니스 로직을 제압하는 개발자가 퇴근을 한다 • SOLID한 컴포넌트 만들기 • Logic First, React Late 📚 노션에 정리한 스터디 노트 이번 챌린지는 이해가 어려워 노션 스터디 노트는 비공개 합니다... 🥲 더더더 많~~이 공부를 해야할 듯한데, 이 스터디 노트를 업데이트 할 날이 올..
코드스테이츠 프론트엔드 부트캠프 후기 (CodeStates SEB, KDT 국비지원과정) KDT(K-Digital Training) 국비지원 과정으로 코드스테이츠 프론트엔드 부트캠프를 수료한지 약 2개월 정도가 지났다. 수료 후 후기를 작성하려고 생각은 하고 있었는데, 마음처럼 움직여주지 않던 게으름과 코드스테이츠가 다시 국비지원 과정이 사라짐으로써 이 글을 누가 보려나~ 하는 생각에 미뤄두고 있었는데, 나의 TodoList에 매번 업데이트 되듯 “코드스테이츠 수강 후기 작성하기”가 거의 두 달 째 따라오고 있어 그 모습을 더는 볼 수가 없어 얼른 해치워버리기로 했다. 나는 지난 4월부터 10월까지 개발 부트캠프를 운영하는 “코드스테이츠”에서 웹 프론트엔드 과정을 학습했다. 사실 부트캠프 4개월 쯤 지나고, 팀 프로젝트에 진입하기 전 “코드스테이츠 프론트엔드 부트캠프 4개월 수강 후기(팀 프..

반응형