profile
노력하는 성장형 프론트엔드 지망생

gsap 배경고정 스크롤 텍스트 엔딩레효과

배경을 고정시키고 스크롤을하면 텍스트를 위로 올라가면서 사라지는 방식.tc로 스크롤트리거 효과및 지점을 결정하고tc.to 후 뒤에 .to 로 계속 이으면 하나가끝나면 하나가 실행된다.

2022년 5월 17일
·
0개의 댓글

gsap 인터렉티브 사용기

자바스크립트 기반 모션 인터렉티브 찾아보고 공부하려다아는분이 지삽을 추천해서 사용하게되었는데.이게 엄청 편하고 다양하고 모션쓰기가 좋아서 글을쓴다.대표기능중하나인 스크롤트리거https://greensock.com/docs/v3/Plugins/ScrollTrig

2022년 5월 8일
·
0개의 댓글

코로나에 걸렸다..면접합격 그렇지만?

코로나에 걸려서 몇일 고생하고 생활리듬도 망가져 지금은 다시 생활리듬을 찾으려 노력중이다.코로나에 걸린와중에 면접에 합격했다. 연봉도 생각대로 괜찮았지만 회사내에서 내분야 같이할동료도 사수도 없어서 몇일 진짜 고민을했다 여러모로 지인들에게 의견도 구해서 생각을 많이했다

2022년 4월 17일
·
0개의 댓글

Post Css 기본사용법

기본적으로 PostCss는 리액트 프로젝트 생성일때 자동으로 설치된다.css 파일을 만들때.test.css 일경우test.module.css 이런식으로 파일이름에 모듈을 넣는다.적용시 방법.Button.js 컴포넌트 파일.임포트 해서 연결css 파일 내용.사용시 사용방

2022년 4월 1일
·
0개의 댓글

[React]Habit Tracker 리액트 훅을 사용한 제작법

드림코딩 엘리 리액트 Habit Tracker의 리액트 최신버전으로 훅을이용하여 제작 하는코드지만 구조를 잘못짜서 데이터를 받아오는게 꼬였지만 useEffect를 이용해서 제작하였다.app.jsapp.js 에서 훅을 사용하려했지만 app에서는 훅을 사용하지않는걸 권장한

2022년 3월 23일
·
0개의 댓글

Zustand 기본 사용방법 (리덕스보다 쉽다.)

기본 설치 방법.파일저장소 생성가져오기아무 컴포넌트에서나 사용가능저장소안에 두번째 저장소 만드는법.디버깅툴 사용법임포트 후에 create 를 devtools로 감싸주기

2022년 3월 18일
·
0개의 댓글

리액트 기초 / 터미널 명령어

리액트는 사용자정의 태그를 만드는 본질이다.(컴포넌트를 이야기하는것)npx create-react-app 프로젝트이름 .점 하나만 적을시 그폴더에 만듬.npm run build 배포용 파일로 변환 시킨다.npx serve -s build배포용 파일 index 파일을 서

2022년 3월 17일
·
0개의 댓글
post-thumbnail

react-redux 의 createAction, createReducer, createSlice 사용법

createAction(링크)공식문서 세부설명 자료(링크)좀더 자세한 다른분의 최신 설명 자료 링크(클릭)import { createAction } from '@reduxjs/toolkit'; 기존함수createAction을 이용한 변경된 코드액션 함수를 지우고 간결화

2022년 3월 13일
·
0개의 댓글

react-redux 로 ToDo List 만들기 (routes 사용

좀더 쉽게 그리고 코드를 최소로 쓰려고 노력했다 그리고 엄청 쉬운해결법을 두고 3일동안이나 못찾아서 스트레를 받았었지만 풀고나서 속시원한 작업이었다.

2022년 3월 11일
·
0개의 댓글

2019년 이후 react-redux 리덕스 공부시 알아둬야할것.

2019년이전 connext함수 리액트-리덕스와 2019년이후 react-redux 다른점.리액트-리덕스의 훅이다. useSelector()useDispatch()connect함수는 컨테이너 컴포넌트를 만드는 또 다른 방법입니다. 이 함수는 사실 앞으로 사용 할 일이

2022년 3월 8일
·
0개의 댓글

CSS / Flex 에 대한 정리

flex 개구리로 공부하기 여기클릭(https://flexboxfroggy.com/justify-content를 사용하여 이 CSS 속성은 요소들을 가로선 상에서 정렬하며 다음의 값들을 인자로 받는다는 것을 기억하세요flex-start: 요소들을 컨테이너의 왼

2022년 3월 5일
·
0개의 댓글

Redux 기본 사용법 (설치)

스토어(상점같은 판매자와 구매자 역활) 데이터를 모아두어 필요한 컴포넌트에서 데이터를 스토어에서 가져가서 사용하는 시스템. 중앙관리되는 데이터를 가져다 씀으로서, 데이터 누락, 무한화면그리기 없이 깔끔하다.공식문서 링크리액트 프로젝트를 이제 시작하려 한다면! CRA(c

2022년 3월 3일
·
0개의 댓글