인프런 React 강의 듣고 사이트 만들기 _ Front 작업 02. wifi 애니메이션 만들기 (styled-components)
(강의내용과 큰 상관없습니다. 강의 듣고 결과물 만드는 작업 중입니다.) 작업물에 wifi 애니메이션이 필요해서 제작해보기로했습니다. 뭐 대충 이런거.. 딱히 기능은 없고 css 애니메이션으로만.. codepen.io에서 간단한 코드를 발견해서 크기만 수정해서 사용하기로 했습니다. 감사합니다 ㅎㅎ 코드 출처입니다. https://codepen.io/roncallyt/pen/GymuE Wifi signal, pure CSS Português: Fazendo um sinal de wifi usando somente CSS e animações CSS3 através da regra @keyframes. English: Making a wifi signal using only CSS and ... codepe..
인프런 React 강의 듣고 사이트 만들기 _ Front 작업 01. 기본셋팅
React 강의 듣고 나만의 사이트 만들기 시작!! 먼저 초반부 Front 작업을 진행한다. 쪼랩이라 라이브러리 다운받을때 빼먹는건 진행하면서 차차 고치도록 해야겠다. 친절하게 코드가 다 들어있지않은 이유는 스스로 공부하는 목적이기때문에 사소한 부분이 많이 빠져있다. 1. 내 사이트명의 폴더를 생성한다. OKAYOON 2. Front 와 Back 따로 진행해야하기에 폴더를 두개 생성한다. OKAYOON -front -back // front npm init npm i next@9 react react-dom npm i prop-types npm i eslint eslint-plugin-import eslint-plugin-react eslint-plugin-react-hooks -d npm i -D ba..
[아티클 프로젝트 040] 취준생이 반드시 알아야 할 프론트엔드 지식들-프론트엔드 전반
"프론트엔드 전반" 포스팅을보고 공부하면서 요약해보자! CSR(Client Side Rendering)과 SSR(Server Side Rendering) SPA (Single Page Application) 하나의 HTML 파일을 기반 자바스크립트를 이용해 동적으로 화면의 컨텐츠를 바꾸는 방식 MPA (Multiple Page Application) 사용자가 페이지를 요청할 때마다 웹 서버가 요청한 UI와 필요한 데이터를 HTML로 파싱해서 보여주는 방식 전통적인 방식 SPA - CSR MPA - SSR CSR SSR 브라우저의 렌더링 과정 원리 렌더링엔진이 HTML, CSS, Javasript 렌더링 시에 CRP(Critical Rendering PAth) 프로세스로 진행 과정 HTML 파싱, DOM(..
Typescript 기초 학습 11.기초문법9_d.ts파일_definitelyTyped_intersection_call_apply_ts유틸리티_데코레이터(인프런_Zerocho님 강의 학습 의식의 흐름대로 노트 정리)
인프런 타입스크립트 기초를 통해 공부중이며 제로초님의 유료강좌입니다. 코드를 통으로 가져오지는 않겠습니다.(내가 글을 쓰면서 복습하는게 목적이기때문에 필요한 부분만) 타입스크립트에 익숙하지않다면 자바스크립트로 먼저 코드를 작성하고 그 후에 타입스크립트로 변환하도록하자. 타입스크립트 (Typescript) 오 드디어 강의가 거의 끝이 나 보인다.!!!! 강의보고 이해하고 글한번 적고,, 다른것도 하다보니 되게 오래걸렸다. 다보고나면 뭐 하나 만들어보고 간단히 강의 훑고 react랑 typesctipt 같이 써봐야지! 진짜 의식의 흐름대로 글을쓰다보니 1회차부터 보니까 ㅋㅋㅋ 내가 헷갈림..ㅎㅎ 나중에는 공식문서보면서 좀 제대로 알아봐야겠다. Typescript를 지원하는 패키지, 아닌 패키지 일단 type..