총총
태그 목록
- 전체보기(97)
- TIL(50)
- React(8)
- code.camp(4)
- API(3)
- REST API(2)
- redux-toolkit(2)
- Optimistic UI(2)
- 알고리즘(2)
- filter(2)
- Husky(2)
- JavaScript(2)
- scss(2)
- project(2)
- 포트폴리오(2)
- 삼항연산자(2)
- ESLint(2)
- Prettier(2)
- 퍼블리싱(2)
- emotion(2)
- JSX(2)
- 프로그래머스(2)
- next.js(2)
- GRAPHQL-API(2)
- 라이브러리(2)
- 프레임워크(2)
- Map(2)
- 깃블로그(2)
- 메소드(2)
- styled components(2)
- typescript(2)
- node.js(2)
- Utility Type(1)
- 쿠키(1)
- 옵셔널 체이닝(1)
- Tic Tac Toe(1)
- 객체(1)
- memoization(1)
- 유효성검사(1)
- yarn(1)
- Index(1)
- 도메인(1)
- 데이터통신(1)
- state prev(1)
- Class Component(1)
- 컴포넌트 재사용(1)
- 배열메소드(1)
- 스코프체인(1)
- kakaomap(1)
- 라우팅(1)
- 카카오지도(1)
- Recoil(1)
- async await(1)
- react redux(1)
- 비동기통신(1)
- parseInt(1)
- number(1)
- package.json(1)
- form태그(1)
- Presenter(1)
- XML(1)
- includes()(1)
- pagination(1)
- graphql 뮤테이션(1)
- github pages 업로드(1)
- observable(1)
- 레이아웃(1)
- login(1)
- unshift(1)
- React Component(1)
- 컴포넌트 폴더구조(1)
- csr ssr(1)
- 자바스크립트(1)
- 문자열(1)
- template literals(1)
- 라우터(1)
- 얕은복사(1)
- CSS in JS(1)
- gh-pages(1)
- async/await(1)
- isotope(1)
- key(1)
- fontawesome(1)
- local storage(1)
- 모달창(1)
- State(1)
- useRef(1)
- gallery(1)
- 간단한 게임(1)
- event bubbling(1)
- stste(1)
- shift(1)
- React-slick(1)
- 다중 slice(1)
- 정규식(1)
- SSR(1)
- Pop(1)
- state 끌어올리기(1)
- HoF(1)
- 최소공배수(1)
- Unity(1)
- infinite scroll(1)
- 페이지네이션(1)
- if문 대체(1)
- gitignore(1)
- 템플릿 리터럴(1)
- JWT토큰(1)
- 코딩테스트 연습(1)
- HoC(1)
- 차이점(1)
- node_modules(1)
- seo(1)
- cookie(1)
- event delegation(1)
- try catch(1)
- CRUD(1)
- GSAP(1)
- apolloClient(1)
- Props(1)
- 권한분기(1)
- MusicPlayer(1)
- 지도연결(1)
- 기록(1)
- commit수정(1)
- redux(1)
- closure(1)
- session(1)
- container(1)
- state원리(1)
- routing(1)
- 로그인(1)
- 터미널 명령어(1)
- object(1)
- mui(1)
- 동기/비동기(1)
- 깊은복사(1)
- npm(1)
- 타입스크립트 기초(1)
- indexOf(1)
- push(1)
- Visual Studio Code(1)
- http(1)
- MapAPI(1)
- Graphql-codegen(1)
- 무한스크롤(1)
- 조건부 렌더링(1)
전체보기 (97)TIL(50)React(8)code.camp(4)API(3)REST API(2)redux-toolkit(2)Optimistic UI(2)알고리즘(2)filter(2)Husky(2)JavaScript(2)scss(2)project(2)포트폴리오(2)삼항연산자(2)ESLint(2)Prettier(2)퍼블리싱(2)emotion(2)JSX(2)프로그래머스(2)next.js(2)GRAPHQL-API(2)라이브러리(2)프레임워크(2)Map(2)깃블로그(2)메소드(2)styled components(2)typescript(2)node.js(2)Utility Type(1)쿠키(1)옵셔널 체이닝(1)Tic Tac Toe(1)객체(1)memoization(1)유효성검사(1)yarn(1)Index(1)도메인(1)데이터통신(1)state prev(1)Class Component(1)컴포넌트 재사용(1)배열메소드(1)스코프체인(1)kakaomap(1)라우팅(1)카카오지도(1)Recoil(1)async await(1)react redux(1)비동기통신(1)parseInt(1)number(1)package.json(1)form태그(1)Presenter(1)XML(1)includes()(1)pagination(1)graphql 뮤테이션(1)github pages 업로드(1)observable(1)레이아웃(1)login(1)unshift(1)React Component(1)컴포넌트 폴더구조(1)csr ssr(1)자바스크립트(1)문자열(1)template literals(1)라우터(1)얕은복사(1)CSS in JS(1)gh-pages(1)async/await(1)isotope(1)key(1)fontawesome(1)local storage(1)모달창(1)State(1)useRef(1)gallery(1)간단한 게임(1)event bubbling(1)stste(1)shift(1)React-slick(1)다중 slice(1)정규식(1)SSR(1)Pop(1)state 끌어올리기(1)HoF(1)최소공배수(1)Unity(1)infinite scroll(1)페이지네이션(1)if문 대체(1)gitignore(1)템플릿 리터럴(1)JWT토큰(1)코딩테스트 연습(1)HoC(1)차이점(1)node_modules(1)seo(1)cookie(1)event delegation(1)try catch(1)CRUD(1)GSAP(1)apolloClient(1)Props(1)권한분기(1)MusicPlayer(1)지도연결(1)기록(1)commit수정(1)redux(1)closure(1)session(1)container(1)state원리(1)routing(1)로그인(1)터미널 명령어(1)object(1)mui(1)동기/비동기(1)깊은복사(1)npm(1)타입스크립트 기초(1)indexOf(1)push(1)Visual Studio Code(1)http(1)MapAPI(1)Graphql-codegen(1)무한스크롤(1)조건부 렌더링(1)
Music player
키프레임은 정말 너무나도 인터렉티브 하다. 그래서 더 배우고 싶지만 자바스크립트가 아직 손에 안익어서 큰일이다. 취업하려면 결국 절대적인 코딩시간을 늘려야겠지 저번주에 music player를 만들었는데 블로깅을 할 시간이 없었다. 지금 해보자면 html, scss, javascript를 이용한 music player이고, keyframe을 사용해 8개 팬넬이 45도씩 원형으로 배치되어 돌아간다. html의 구조는 단순히 body>figure>h1+a+section 또 안에 play 버튼을 누르면 시작하고 reload버튼은 처음부터 다시 시작하게 하고, pause 버튼은 재생을 멈춘다. > ![](https://velog.velcdn.com/images/namyeji/post/4
2023년 4월 3일
·
0개의 댓글·
0