모바일, 태블릿, pc 반응형 인스타그램 클론코딩

vscode 세팅, 필수 extension 세팅

CSS BEM 규칙

reset.css를 활용한 초기세팅, 폴더 및 파일구조 만들기

미디어 쿼리를 활용한 모바일, 태블릿, pc 디바이스 최적화

flexbox를 활용한 정렬

(position, transition, transform(translate 함수))를 활용

grid를 활용한 화면 배치

검색, 알림, 더보기 애니메이션 구현

순수 javascript를 활용한 웹캐러셀, 모바일 터치 캐러셀 구현

javascript 기본문법(변수, 함수, 조건문, 반복문(for, forEach, while), 배열, 객체, 옵셔널체이닝, arrow function, 이벤트위임(캡처링, 버블링)) 활용

javasript DOM 조작을 활용한 랜더링 ( createElement, appendChild, parentNode, removechild, querySelector, querySelectorAll,getElementById, children, getAttribute, setAttribute, classList.add, classList.contains, classList.toggle ... )

순수 javascript를 활용해 카테고리 필터링 구현

글쓰기, 댓글, 공유 모달창, dim 처리 구현

이미지 업로드, 비디오 재생 및 비디오 무음처리 구현

navBar(사이드바, 탑, 바텀바)구현, 모바일웹에 맞게 네비게이션바 최적화

로그인, 회원가입, 홈, 릴스, 탐색, 메시지, 프로필 페이지 구현

북마크, 좋아요 구현

폰트어썸을 활용해 아이콘 적용하기

공통 컴포넌트 쪼개기

github-pages를 이용한 배포

서비스를 만들어보고 싶으신 분

웹 및 앱개발에 흥미가 있으신 분

라이브러리,프레임워크 사용 안하고 순수 html, css, javascript만 이용해서 서비스를 만들고 싶으신 분

html

css

javascript