🎨

기초 프론트엔드 스터디 소개

스터디 소개

스터디 주제

프론트엔드 개발 입문용 스터디입니다.

다룰 수 있는 프로그래밍 언어는 있지만 아직 자바스크립트나 프론트엔드 개발을 접해 본 적 없는 분들께 추천 드려요!

HTML, CSS에 대한 개념은 미리 예습 후 참여하시는 것을 추천 드립니다.

멘토 소개

신촌 연합 IT 창업 동아리 CEOS 16기 FE 신촌 연합 IT 동아리 CEOS 17기 FE 운영진 브레이크 매거진 • FE 2023 오픈소스 컨트리뷰션 아카데미 고스락 티켓 2.0 어드민 대학생이라면 이용해야 하는 IT 스펙 저장소, 프리폴리오(pre-folio.com) 모두를 위한 새로운 공연 라이프, 두둥 FE(dudoong.com) CEOS 홈페이지 리뉴얼 프로젝트 FE(ceos-sinchon.com)

기초 프론트엔드 스터디의 학습 목표

웹 브라우저와 자바스크립트에 대해 학습합니다.

Vanilla JS를 이용해 간단한 페이지를 구현해 봅니다.

React를 학습하며 Virtual DOM 및 React의 기본 원리를 이해합니다.

React를 이용해 간단한 페이지를 구현해 봅니다.

스터디 일정

전체 일정

총 8주간 진행되며, 9/11부터 스터디 1주차를 진행합니다.

별도의 세션 없이, 온라인으로 진행됩니다.

•

교재(1-2주차): 모던 자바스크립트 입문 - 이소 히로시, 길벗 출판사

•

강의(5-6주차): 한입 크기로 잘라먹는 리액트 - 이정환

시험 기간

시험기간은 휴강 기간입니다.

중간고사 : 10월 18일~ 10월 31일 휴강 (2주)

기초 프론트엔드 스터디 커리큘럼

커리큘럼 표

주차

난이도

미리보기

키워드

학습범위

1주차(9월 13일 ~)

Open

기초

모던 자바스크립트 입문 도서를 통해 Javascript의 기본 문법을 학습합니다.

Javascript

DOM

React

Virtual DOM

Hooks

모던 자바스크립트 입문 1장~7장

2주차(9월 20일 ~)

Open

기초

모던 자바스크립트 입문 도서를 통해 Javascript의 기본 문법을 학습합니다.

Javascript

모던 자바스크립트 입문 8장~15장

3주차(9월 27일 ~)

Open

초급

Vanilla JS로 투두리스트를 만들어 보며 DOM을 조작하고 기능을 개발하는 방식에 익숙해집니다.

Javascript

DOM

4주차(10월 4일 ~)

Open

중급

Vanilla JS로 계산기를 구현하며 DOM을 보다 능숙하게 조작하고 flexbox 등 css에 익숙해집니다.

Javascript

DOM

5주차(10월 11일 ~)

Open

초급

강의를 들으며 자바스크립트에 대해 복습하고 React 학습을 시작하며 Virtual DOM에 대해 학습하고 기초를 다집니다

React

Javascript

Virtual DOM

한입 크기로 잘라 먹는 리액트 section 1 ~ section 4

6주차(11월 1일 ~)

Open

중급

강의를 들으며 React로 감성 일기장을 만들어 보며 State, Props, Lifecycle에 대한 개념을 학습합니다.

React

Javascript

Virtual DOM

한입 크기로 잘라 먹는 리액트 section 5~ section 6

7주차(11월 8일 ~)

Open

초급

Vanilla JS로 만들었던 투두리스트 앱을 React로 리팩토링 하며 차이를 비교해 봅니다.

React

Javascript

Virtual DOM

8주차(11월 15일 ~)

Open

중급

React 투두리스트에 Custom hooks, Json 파일로 저장된 데이터 불러오기, 로컬 스토리지 사용 등 다양한 기능을 추가해 봅니다.

React

Javascript

Virtual DOM

Hooks

COUNT8

스터디 진행 방식

출석

매주 진행되는 기초 프론트엔드 스터디는 온라인으로 과제가 나가는 형식이며, 주어진 미션을 매주 수행하며 기본적인 프론트엔드에 대한 지식을 학습해 보도록 해요!

매주 수요일 자정에 체크되는 숙제를 통하여 출석체크가 진행됩니다. 지각 제출 및 과제 치팅은 출석으로 인정되지 않습니다.

스터디 주간 회고 WIL (Weekly-I-Learned) 작성

매주 배운 것들을 기록하고 공유하는 시간을 가집니다. 과제가 없는 주차라도, WIL은 기본적으로 꼭 작성 후 제출하셔야 합니다.

WIL은 마크다운 형식(md)으로 작성되어야 하며, 아래 형식은 정상적인 미션 WIL 제출로 인정되지 않습니다.

•

WIL 글자 수 300자 미만

•

블로그 링크

운영진이 모든 제출기록을 꼼꼼히 확인하므로, 부정제출 및 치팅은 지양해주세요!

WIL은 무엇이고 왜 작성해야하나요?

자신이 이번 주차에 배운 내용을 깃허브 해당 주차 WILn.md에 업로드하여 WIL 작성을 한번에 확인할 수 있도록 합니다.

주차별 미션

강의 종료 이후 매주 미션이 부과됩니다.

주차별 미션의 경우 구현해야 하는 과제 명세와 함께 예제 코드, 참고 레퍼런스가 첨부될 수 있습니다.

주차별 미션에는 기본 요건과 선택 요건이 존재하며, 선택 요건은 자유롭게 수행하면 됩니다.

부과된 미션은 매주 수요일 자정 (12:00)까지 자신의 레포지토리에 제출합니다.

지각 제출의 경우 받지 않으며, 다음 주차 미션과 함께 제출합니다.

숙제 공지는 디스코드로 나갈 예정이므로, 꼼꼼히 확인해주세요!

과제 제출 방식

아래의 참고 페이지를 통하여 과제 제출을 해주세요!

과제 제출 전 꼭 확인해야 하는 사항

github를 이용한 과제 제출 가이드

스터디 규칙

출석 기준

해당 주차의 기한 내 미션을 제출해야 n주차 출석으로 간주합니다.

해당 주차의 미션은 다음과 같습니다.

= WIL 제출 (기본적인 과제) + 프론트엔드 n주차 미션(멘토 과제) 두가지 모두 제출해주셔야 하며, WIL은 위에 언급된 규칙을 꼭 지켜주셔야 합니다.

질의응답

과제나 스터디에 대해 궁금한 점은 기초-프론트엔드-스터디에 질문해주세요!

기초 프론트엔드 스터디의 경우 질문을 봐주실 수 있는 강사님과 멘토님의 수가 적어 원활한 질문답변 진행을 위해 아래의 질문 가이드라인을 꼭 지켜주세요!

질문 가이드라인

원활한 질문답변 진행을 위하여 질문 시간은 오후 6시~11시로 제한합니다.

스터디 수료 기준

스터디 수료의 조건은 출석률 70% 이상입니다.

수료자에게는 공식 수료증이 발급되며, 다음 학기 회비를 할인해 드립니다.

우수 참여자

우수 참여자 선정 기준은 아래와 같습니다.

과제 제출을 성실하게 했는가?

커뮤니티 및 스터디 활성화에 기여하였는가?
(새로 알게 된 내용을 스터디 채널에 공유)

스터디원들에게 도움이 될만한 질문을 적극적으로 수행하며, 멘토님에게도 모르는 내용을 꼼꼼히 확인하는가? 

우수 참여자의 경우 전체 참여자의 일정 비율만큼 총 2회 (4회차, 8회차) 선발합니다.

우수 참여자에게는 다음 혜택을 제공합니다.

•

소정의 기프티콘 증정 