리액트의 프레젠테이션 컴포넌트와 컨테이너 컴포넌트를 보고

컴포넌트의 재사용에 대한 방식을 생각해 보았다. 

이렇게 재미있는 방식을 왜 아직도 몰랐었나 싶다.

개념이 재미있어 그림으로 그려보려고 한다.

재활용 할 수 있는 프레젠테이션 컴포넌트에 

각각 목적에 다른 데이터를 넣어주면 

용도에 맞는 컴포넌트가 만들어진다.

만약 컨테이너 없이 로직과 데이터를 메인에서 재사용할 컴포넌트에 넣어주게 된다면 

메인공간이 지저분해 질 것이다.

1. bind:this = {...} 로 엘리먼트와 바인드하기

2. 외부에서 가져오기

svelte.dev/repl/28f4b2e36e4244b8b23cae3d584c4c88?version=3.16.6

3. dispatch

4. props

5. package 만들기.

혼자서 개발을 할때는 기획 역시 혼자서 해야 한다.  

사실 다른 사람들은 혼자 개발할 때 기획과 개발을 정확히 나누면서 하는지 그렇지 않은지 모르겠지만

난 그렇게 하지 않았다. 그래서 문제가 발생한 것이다.

모든걸 개발이라고 생각해 버린것...

정확한 기획 없이 코드를 만드려했다.  그러다 보니 애매하다... '어떻게 만들겠다' 정하지 못한체로 만들 생각이 끼어든다.

사실 코딩하는 것은 생각보다 단순하다. 왠만한건 구글에 다 나와있다.

명확한 목표가 있으면 그걸 구현하는건 그저 시간투자이다. (물론 깔끔하고 완벽한 코딩은 어렵겠지만)

하지만 기획에서 명확한 구현의 목표를 정하지 못하면 코딩이 막혀버리고 

코딩은 어렵다... 라고 잘못된 인식을 가질 수도 있다.

기획이 어려운게 정답이 없다...ㅠㅠ

이렇게 할까? 저렇게 할까? 애매하게 생각이 끝나는 경우가 많다... 

생각이 열린 상태에서 닫고 마무리 짓지 못한 것이다.

아마 이건 기획서라도 작성을 하면 도움이 될 것 같다.

그도 그럴것이.. 기획서를 만들지도 않으니..

그냥 '머리에 있으니 그대로 하지' 라고 생각하지만 얼마뒤 뭘하려는지 까먹게 되는거...

기술적인 것과 코딩이 더 어려울거라는 편견 때문에 기획에 집중하거나 시간과 공을 들이지 못한다.

어째튼 취미로 하는 코딩 머리아프면 재미 없다.

아이디어를 만드는 일 = 기획

이 기획을 명확히 생각하는게 더 중요할 것 같다. 

그래야 그 아이디어를 코드로 번역할 것 아닌가.......

* 기획아이디어 및 홍보 아이디어

매우 중요.

(

구현에서의 아이디어

생각하는 기능을 만들때에 만드는 방법에 대한 아이디어.

)

JSON 형식의 데이터는 다음과 같이 라벨(KEY)과 그에 해당하는 값을 지니고 있는 형태의 데이터이다.

[
{'name':'김정희', 'height':163, 'weight':50},
{'name':'김남혁', 'height':183, 'weight':92},
{'name':'오준혁', 'height':173, 'weight':58}
]

우리가 JSON 형식의 데이터를 얻었을 경우 프로그래밍을 할 줄 알면 그 데이터를 사용이 쉽게 가능하지만 

그렇지 않으면 그 데이터를 어떻게 사용해야 할지 난감할 수가 있다.

쉽게 이 데이터를 위의 표처럼 얻어 낼 수 있는 방법 중 가장 쉬운 방법은 구글에서 json에서 테이블이나 CSV로 변환해 주는 사이트를 찾는 것이다.

JSON to CSV converter에 들어가서 쉽게 CSV를 다운 받을 수 있다!

사실 취미로 개발이 가능하다. 왜냐면 이미 많은 소스가 모듈/플로그인화 되어있어. 가져다 붙이면 많은 것들이 만들어진다. 하지만 "뭘 만들어 보고 싶은가... " 이게 가장 중요한거 같다.

요즘 이미 다양한 어플이나 앱이 나왔고 수 많은 어플들이 사람들에게 한번도 사용되지 않았다.

나에게 혹은 주변에게 도움이 되는걸 만들고 싶다. 

지금까지 ngrok을 써왔다. 그런데 유료가 되면서 커넥션에 제한이 생겼다. 

그래서 찾은게 localtunnel ngrok과 사용 하는 방법은 똑같다. 

https://github.com/localtunnel/localtunnel

설치: npx localtunnel --port 3000

사용: lt --port 3000

import {} from 의 뜻

https://stackoverflow.com/questions/36795819/when-should-i-use-curly-braces-for-es6-import

https://www.sitepoint.com/state-management-in-react-native/