웹개발

변수 왜 두개??

리액트는 자바스크립트를 통해 html를 생성한다. 바닐라 자바스크립트는 html을 통해 자바스크립트 소스코드를 생성하므로 방향성이 다르다. 리액트는 라이브러리인데 이미 누군가 구현한 것을 배워서 갖다 쓰면 된다. 바닐라 자바스크립트를 베이스로 하므로 리액트를 배웠다고

어제 배운 내용을 바탕으로 kilometers<->miles 변환 기능을 추가해 컨버터를 완성했다. 영상 댓글에 수강생들의 작품이 종종 링크로 올라오는데, 그 중 디자인이 예쁜 작품을 참고해 css를 작성했다. input에 값 입력 시 받아오기받아온 값을 kilo

effects

영화 정보가 담긴 api를 활용해 간단한 영화 소개 사이트를 만들고 있다.

async-await, 동적 url영화앱에 navbar, 카테고리 기능 추가

movie app을 만들면서 여러 디자인을 생각해봤는데, 이미지 슬라이드는 이 기회에 넣어보고 싶어서 공부했다.연습을 위해 예제를 만들었다. 이미지 네장과 아래의 html, css를 만들었다.남이 만든 css를 볼때마다 느끼는건데 이해하기 참 어렵다^^. 익숙한 것도

자바스크립트, 리액트 공부

movie app 배포

콘텐츠모델, 시멘틱마크업html5는 html 요소의 성격에 따라 요소의 종류를 정의하는 규칙이 있다. 그것이 콘텐츠 모델이다.콘텐츠 모델은 위와 같이 7개로 나눌 수 있다.메타데이터는 콘텐츠의 style, script를 설정하거나 다른 문서와의 관계 등의 정보를 포함하

(미니프로젝트) fine dust-앱와이어프레임, 리액트 라우터 적용

css개념이 미흡해서 레이아웃에서 턱...! 막혀버렸다. 동아리 광탈하고 분노의 프로젝트 진행하다보니 계속해서 부족한 부분을 발견하고 있다.대부분이 부족하지만 그만큼 더 공부하라는 뜻으로 알고 열심히 해보려고 한다 ^,^인프런에서 부트캠프 퍼블리싱 강의를 1100원에

float은 flex, grid가 생기기 전에 만들어진 css이다. 현재는 레이아웃에 거의 사용하지 않지만 아직도 float을 사용한 문서는 남아있기 때문에 어떻게 작동하는지 아는 것이 중요하다.float은 일반적인 레이아웃의 흐름을 원하는 방향으로 바꿀 수 있다. 기

flex로 와이어프레임 제작flex 마무리react

구조분해할당, 예전 값을 이용해서 setState할 땐 함수형으로(prevState), DOM에 직접 접근하고 싶을 땐 ref사용하기

깃 오가니제이션 생성, 팀플 이슈, 브랜치, 커밋, PR컨벤션 확정, 브랜치 관리 연습

calc, position, z-index, transition, webpack

CSS transform, React map

CSS 반응형 웹, 미디어쿼리, react to-do-list

라이프 사이클, 클로저 문제, 고차 함수, useEffect (중요*)

JS-화살표 함수, this, 호이스팅

구조분해할당, 클로저, 프로미스(callback, promise, then, catch, finaly), async, await

React - CSS module, props(객체 구조분해할당), react-router-dom

REST API, useEffect, useHistory

타입스크립트의 사용 이유, 기본 타입, interface

팀 프로젝트에서 oauth를 사용해서 로그인을 구현해야 했다. 아직 백과 연동을 하지 않아서 미완성이지만 사용한 방법을 정리해본다.