ARABOJA ARABOJA

쓰로틀링은 주로 이벤트에 사용하는 기능이다. 흔한 경우로 웹이 인터렉션 효과를 넣다 보면 쓰로틀링이 필요한 시점이 생긴다. 예를 들어보자면 scroll 이벤트가 있다. box가 scroll 될 때마다 display none~block으로 토글되는 이벤트가 있다고 가정해보자. let target_state = true; function event_scroll() { const target = document.querySelector('.box') target_state = !target_state if(target_state){ target.style.display = 'block' }else{ target.style.display = 'none' } console.log('scroll!!') } 클라이언..

Create React App이 편리하긴한데 나는 내 포트폴리오에 내 서버를 만드는게 목표니까 기본 제공 기능 말고 서버를 직접 만들어서 연동시키고 싶었다. 근데 이 CRA의 구조가 어떻게 되어있는지도 모르고 어떻게 연동해야하는지도 몰라서 한참 해맸는데 eject라는 기능을 이용하여 숨겨진 구조를 푸는? 그런 행동이 가능했다. 사실 내가 잘 하는 분야도 아니니... 내가 찾아낸 정말 잘 설명된 글의 링크로 대체한다. https://m.blog.naver.com/PostView.nhn?blogId=93immm&logNo=221306747644&proxyReferer=https%3A%2F%2Fwww.google.com%2F 개X같은 windows에서 하는 react.js 개발 (1) / create-reac..

저번에 React에서 가장 중요한 개념이었던 component와 props에 대해 썼다. 그리고 항상 세트로 따라다니는 state와 component life cycle에 대해서 정리해보고자 한다. state는 기본적으로 변수와 비슷한 개념이다. 변수인데 특별한 기능이 주어진 변수라고 생각해도 좋다. 기본적으로 state를 선언하는 법은 아래와 같다. import React, { Component } from 'react' export default class App extends Component { state = { myName: 'I am state!' } render() { return ( Nothing... ) } } 이렇게 state를 생성하고, state를 사용하는 방법은 아래와 같다. im..

리액트는 컴포넌트단위로 개발한다. (JSP가 익숙하다면 include의 개념과 비슷하다) 즉 Header, Section, Footer ~ Section의 자식 mainVisual~ 등을 파일을 나눠서 작업할 수 있다. 블럭 여러개를 만들고 조합해서 웹을 완성시키는 방식이라고 보면 된다. 이런 방식에는 여러 장점이 있다. 나중에 다루게 될 component lifecycle에 대해서 분리하여 사고할 수 있다. 단방향 tree구조로 컴포넌트 별로 분리하여 개발이 가능하다. 컴포넌트 방식은 팀단위 작업을 할 때 범위를 명확하게 한다. JSX 를 이용한 Virtual DOM방식이기 때문에 변화되는 Component 빼고는 그대로 둬서 더 효율적이다. 따라서 동적인 웹 페이지일 때 상황에 따라 render가 많..

프로젝트에서 선택한 CSS 프레임워크 Bulma를 맛보기 처럼 써보고 느낀 점이다. 긍정적인 면과 부정적인 면이 있는데 사실 부정적인 면이 더 크게 느껴진다. 우선 가장 대중적이고 안정성이 확실한 Bootstrap을 사용하지 않은 이유는 너무 무겁다. 기능이 불필요하게 너무 많다. 부트스트랩을 사용한 토이프로젝트를 해봐서 부트스트랩틱한 디자인도 벗어날 겸 새로운 프레임워크를 써보고 싶었다. 그리고 Bulma를 선택한 이유는 Bulma는 css파일 하나만으로 적용하는 가벼운 프레임워크다 모든 것이 class 기반이기 때문에 tag에 디자인이 들어가지 않아 내가 직접 만지고 싶은 부분을 간섭하지 않는다. Flex 기반이기 때문이다. Flex를 거의 사용하지 않았고 잘 몰랐다. 우선 내 나름으론 큰 프로젝트에..

원래는 배우면서 프로젝트를 하려고 했는데 좀 보니 각이 안나와서 강의를 봤다. 깃허브를 풀밭으로 만들려고 했는데 깃허브는 커녕 블로그도 꾸준히 못쓰고있다. 리액트를 택하길 잘 한것같다 리액트 자체가 원시적으로 HTML CSS JS 연결하는 방식이 아니라 제대로 된 개발환경을 거의 강제하다시피 하기때문에 기본적인 웹구조를 익히는 단계의 역할도 해주는 느낌이다 방식이 굉장히 체계적이라서 정말 재밌게 하고있다. 아직 포스팅도 안하고 리포도 안만들었지만 lastFM API로 음악 정보를 가져오는 곳 까지 만들었다. 별개로 CSS 프레임워크도 써보고 싶어서 Bulma를 선택해서 사용해보고 있는데 굉장히 하고싶은 말이 많다 따로 글을 써야겠다.

제네시스는 역사가 엄청 길고 장르를 바꾸기도 했다. 그래서 이 글에서는 가장 인기가 많은 Nursery Crime ~ Selling England by the Pound 시기만 쓸 것이다. 그리고 제네시스가 팝으로 전향한 후의 음악은 딱히 취향이 아니다 왜 킹크림슨 예스 핑크플로이드보다 먼저냐면 내가 제일 좋아해서. 들어볼 사람이라면 알겠지만 프록은 원래 앨범단위로 들어야 한다.

장르를 거의 차별해서 듣지는 않는데 그래도 특히 애정가는 장르가있다면 프로그레시브 록이다. Progressive 1. 진보적인 2. 점진적인, 꾸준히 진행되는 장르 이름은 진보적인인데... 프로그레시브 록의 황금기는 1960년대 중후반에서 1970년대 초반이었다. 장르 특징은 이렇다. 서사적이고 곡이 매우 길다. (대곡 지향) 거의 무조건 앨범형태로만 발매하고 앨범의 구조또한 서사적이고 컨셉 지향적이다. 형식이 정해져있지 않고 생소한 악기, 소리(자명종 소리, 개가 짖는 소리 등) 을 적극적으로 사용하기도 한다. 클래식, 재즈등의 요소를 적극적으로 사용하기도 한다. 즉 길이가 길고 진지한 형식없는 록이다. 때문에 장르의 영역이 특히 모호하기도 하다. (아트록 포스트록 등과 접점이 많다.) 정말 전설적인 ..