☁️ [‎kakao X goorm] DEEP DIVE | FE

사용 프로그램 > 브라우저: Chrome 코드 에디터: VS code HTML이란? HTML (HyperText Markup Language) 웹페이지를 만들기 위한 표준 마크업 언어로, 웹을 이루는 가장 기초적인 구성요소 요소 요소의 종류? 빈 요소(empt

Flex Box or Grid Box 사용해서 영화 나열하기영화에 마우스로 hover하면 영화 이미지의 사이즈 키우기배경 이미지 netflix_bg.jpg 와 넷플릭스 로고 이미지 netflix_logo.png : June님의 티스토리에서 제공하신 이미지 다운 링크를

브라우저의 디버깅 콘솔에 접근할 수 있는 메소드들을 제공하는 객체VsCode의 GoLive server를 활용해서 웹페이지로 확인하고, 개발자도구의 콘솔로 들어가서 콘솔객체의 출력들을 확인함 JavaScript에서 변수를 선언하는 방식: var, let, constsc

JS

변수명을 최대한 명확히 작성, 함수도 최소한의 단위로 나누어서 사용페이지를 새로고침해도 데이터가 지속될 수 있도록 하기↪ localStorage 사용공부한 내용 & 더 찾아볼 내용

자바스크립트 OOP를 이용해서 구현비동기 통신 이용추가로 잔디밭 기능, spinner 기능 등 원하는 기능 추가

현재 focus 된 셀의 위쪽 헤더 왼쪽 헤더가 함께 하늘색으로 하이라이트 되도록 해줌작성된 모든 데이터들을 Export SpreadSheet 버튼을 눌러서 Excel 파일로 생성생성된 Excel 파일을 구글 Spreadsheet 에서 import하면 같은 데이터가 나

출처: https://github.com/marpple/FxJS명령형 → 함수형 프로그래밍(이터러블)로의 변환을 다룸상수 limit과 리스트 list를 인자로 전달받아서 list의 수 중 홀수를 제곱한 후 limit개만 더하는 함수 작성\--limit : li

홀수 n개 더하기

과제 내용 최대한 컴포넌트를 나눠서 구현하기 폴더 이름 및 변수 이름을 명확히 작성하기 과정 npm vs npx npm과 달리 npx는 로컬에 저장하지는 않고 패키지를 설치만 해주는 명령어 함수형 컴포넌트 생성 시 자동화 툴 ES7 설치 후 새로운 jsx 컴포넌트 생성할 때마다 rafce (React Arrow Function Component Expo...

reduct와 같은 상태 관리 라이브러리를 사용해서 상태를 관리로그인 기능은 firebase의 인증 서비스 이용상품 데이터는 fakestoreapi를 이용해서 구현할 수 있음예: 상품 가져오기 HTTP GET https://fakestoreapi.com/pro

Next.js 란Next.js 기본 파일 구조Pre-renderingData FetchingTypeScript 란?Next.js와 TypeScript 만들 앱 소개메인 페이지 UI 만들기(마크다운 파일 생성)마크다운 파일을 데이터로 추출하기TypeScript TypeT

Typescript 란?Typescript Type타입스크립트에서 제공하는 타입들타입 어노테이션 및 타입 추론개발 환경 구성tsconfig.json 설정하기타입들 사용해보기타입 단언(type assertion)과 타입 GuardType Alias vs Interface

reduct와 같은 상태 관리 라이브러리를 이용해서 상태를 관리typescript 사용

로컬 글꼴 설치원하는 글꼴 (Pretendard)을 다운받고 .otf 형식의 파일들을 C:\\Windows\\Fonts 경로로 붙여넣기피그마 홈페이지 접속 후 다운로드 란에서 글꼴 설치 프로그램 다운로드 (자동으로 로컬 글꼴을 웹에서 적용 가능하게 해줌)여기까지 했는데