웹 개발 주간 3주차 학습 요약

카테고리

프로그래밍/소프트웨어 개발

서브카테고리

웹 개발

대상자

- 초보 웹 개발자프론트엔드 학습자

- HTML, CSS, JavaScript 기초부터 실무 적용까지 학습 필요자

- 프로젝트 중심 학습을 선호하는 개발자

핵심 요약

  • HTML & CSS Udemy 강의 (https://www.udemy.com/course/understanding-html-and-css/)를 통해 기초 문법 및 디자인 원칙 학습
  • FrontendMentor 챌린지 (예: order-summary-component, profile-card-component)를 통해 실전 프로젝트 경험 확보
  • JavaScript DOM 조작 (https://youtu.be/5fb2aPlgoys)과 GitHub 활용을 통한 코드 관리 및 협업 실습

섹션별 세부 요약

1. 학습 자료 및 핵심 주제

  • HTML/CSS 강의를 통해 HTML5 요소, CSS Flexbox/Grid, 반응형 디자인 기법 학습
  • FrontendMentor 챌린지order-summary-component, profile-card-component, social-proof-section 등 실무형 UI 구현 연습
  • JavaScript 강의에서 DOM Manipulation, Event Handling 핵심 개념 다루기

2. 프로젝트 실습 및 리소스

  • GitHub을 통해 huddle-landing-page, browser-extensions-manager-ui, character-counter 등 다양한 챌린지 프로젝트 저장 및 공유
  • picsum.photos를 활용한 플레이스홀더 이미지 생성으로 디자인 테스트 효율화
  • YouTube 강의 (https://youtu.be/5fb2aPlgoys)를 통한 JavaScript DOM 조작 실습

3. 추가 학습 및 도구 활용

  • Udemy 강의에서 JavaScript의 특이한 부분(예: this 키워드, 클로저) 이해
  • FrontendMentor 챌린지를 통해 UI/UX 디자인 원칙접근성 고려사항 적용
  • GitHub을 통한 버전 관리협업 프로세스 연습

결론

  • FrontendMentor 챌린지를 완료하며 실무형 프로젝트 경험 쌓기
  • GitHub 활용으로 코드 관리 및 협업 능력 향상
  • picsum.photos와 같은 도구를 사용해 디자인 테스트 시 효율성 극대화