0. Intro React 프로젝트를 진행하면서 예상외로 심사숙고 해야하는 부분이 있었는데, 바로 오픈소스 컴포넌트 선택이었다. 단순하게는 내가 원하는 기능을 제공하고 있는지부터, 어디까지 커스터마이징할 수 있는지 / 지원은 활발히 이루어지고 있는지 / 다운로드 수가 얼마나 되는지 / 사용법이 얼마나 직관적인지 (대부분 제공하고 있는 예제 페이지를 통해 확인할 수 있다) 등등 선택에 영향을 주는 요소가 많았다. 어떤 컴포넌트는 기본적으로 상당히 많은 기능을 제공하지만 커스터마이징이 거의 불가능하다는 단점을 함께 가지고 있었고, 어떤 컴포넌트는 정말 기본 뼈대만 제공하지만 props로 내가 원하는 살을 붙일 수 있는게 장점이기도 했다. 요렇게 오픈소스 npm package에 관심을 가지던 중에, 전에 프로..

구현한 기능은 취소선 처리 [기본기능] - data 표기 - one column sorting (ASC / DESC) - 페이징 처리 [심화기능] - change column order by drag&drop - change row index by drag&drop - edit / delete / add rows

아래 항목들을 신경써서 만들어야함 1. 방문자 카운트 표기 api 찾기 2. css로 구현한 간단한 애니메이션을 sass mixin으로 만들어두기 3. layout 및 전체적인 디자인 초라하지만 메인 페이지가 생겼다! +) 화면이 늘어나면 DB, api는 필수가 될 것 같아서 별도 구현하는게 좋겠다

나는 회사에서 조직을 옮기게 되면서 React로 웹 개발을 처음 접하게 되었는데, 그전에 하던 C# GUI랑 비교가 되어서 그런지 React의 컴포넌트가 너무너무 매력적으로 느껴졌다. 띠용! 요소 자체를 붙였다 떼었다 할수 있다니!! 이런 느낌? 그런데 이것도 단점이 있었다 ㅜㅜ 사실은 내 문제인데, 내가 한번 개발한 컴포넌트를 재활용할 일이 많아지다 보니 1. 큰 그림을 보지 못하고 지나치게 공통화에 집착했거나 2. (또) 큰 그림을 보지 못하고 공통화하지 않았거나 3. (또) 큰 그림을 보지 못하고 컴포넌트 별 부모-자식 구조를 불합리하게 짜뒀거나 4. (또) 큰 그림을 보지 못하고 state, props, reducer를 용도에 맞지 않게 써뒀거나 등등... 개발하면서 내가 남긴 흑역사를 보고 스스..

개인 홈페이지를 직접 만들어 보고 싶다는 생각을 한 지는 좀 되었는데, 새해를 맞아서 실행에 옮게 됐음 1. 집에 서버용으로 컴을 켜두는건 부담스럽다. 2. 클라우드 자원을 사용하고는 싶은데, 과금을 걱정하고 싶지 않다. (물론 free tier가 있지만... 기간 제한이 있기도 하고 기간 내에라도 내가 모르는 사이에 과금 기준을 넘어버리는 불상사가 발생하지 않으면 좋겠다 ㅜㅜ) 요 두 가지가 어떻게 홈페이지를 구축할 지 결정하는 데에 가장 중요한 포인트였다. 글을 쓰거나 파일을 업로드 하는 등의 기능은 구현하지 않을 생각이라 static 파일만 호스팅 하면 되는 상황이어서 무료 요금제 사용 중에 나도 모르게 과금이 될 우려가 없는 firebase 를 사용하기로 결정했다 :) 1. 레포지토리 생성 bit..

최근에 회사에서 React를 사용하고 있는데, 여러모로 매력적이어서 개인적으로 더 공부하고 싶은 마음이 있었음. ㅎㅎ 팀을 옮기면서 웹은 처음 해봤는데... 그동안 프론트엔드 프로그래밍에 대해 갖고있던 편견이 많이 깨졌다. 마침 쇼핑몰을 운영하는 친구가 필요로 할 것 같은 프로그램 아이디어가 하나 생겨서 개인 프로젝트로 진행하려고 한다. 브라우저 내의 특정 이미지 태그를 찾아서 소스를 잠시 바꿔치기 해보는 프로그램이라 크롬 익스텐션으로 구현하기로 정했고, 학습욕(?) 충족을 위해 일반 자바스크립트 말고 React를 사용해보기로 결정했다. 크롬 익스텐션에서 React를 사용할 수 있도록 기본 틀을 제공하는 깃이 몇 개 있었는데, create-react-app으로만 리액트 환경을 구축해봐서 한번쯤 처음부터 ..