본문 바로가기

growth-log

(11)
Recoil_ React상태 관리 리코일은 리액트를 개발한 메타(페북??) 에서 개발한 전역적 상태관리 도구로, 프로젝트 전체에서상태를 전역적인 트리로서 관리할 수 있다. 근래에는 다른 관리도구들이 선호되고 있어 흔히 사용되고있지는 않지만 Redux에 비해 사용방법이 쉬워 보여서 접근해보았다. 프로젝트에 리코일을 설치하고 난 후, 리액트 프로젝트의 App설정에서 리코일의 Root트리로서감싸주면 전역적으로 구동하도록 설정된다. 리액트의 상태값은 atom을 통해 초기화할수 있으므로Store를 구성하여 상태의 단위별로 atom을 구성한다. 이렇게 구성된 상태의 변수값을 컴퍼넌트에서사용할수 있으며, 특정 컴퍼넌트에서 상태값이 업데이트되면 관련 컴퍼넌트에서 구독의 방식으로전해지고 리렌더가 발생하면서 전체 화면에서 동일한 상태를 유지한다. 1) 리..
반도체의 유리기판 ? 얼마전 지인이 유리기판 관련주가 Hot해졌다고 지나가는 말로 언급을 했다.유리기판이라니.. 그게 가능해 ? 유리라니 그게 뭘로 이뤄졌다는 거야 ?사파이어 글래스를 말하는 것인가하는 의문이 들었다. 그래서, 이것에 대해 한번쯤은 짚고 넘어가고자 한다. 1. 유리(글래스)라는 소재의 의미는 비정질 반도체 기판 재료중에 사파이어 글래스라는 것이 있다. 사실상 이것은 명칭일뿐 실제로 글래스가 아니다.일반적으로 "글래스"라고 하면 그냥 반짝이고 투명한 것을 부르는 명칭이다.그러나 소재측면에서 "글래스" 즉, 유리의 가장 큰 특성은 비정질이다. ( 원소가 결정을 이루지 않고 마구 배열되어 있으며 구조가 없다는 뜻이다) 가장 완벽하고 조밀한 결정 구조를 가진 물질은 다이아몬드인데 반짝이고 투명해 보이므로 이를 얇게 ..
next의 ssr, csr로 인한 오류제어 지속적인 오류 파티이다. npm에서 react-infinite-scroller를 다운받아 무한 스크롤을 구현하는 과정에서return문안에서 컴퍼넌트로 적용하는 연습을 했다. 모듈을 설치하고 컴퍼넌트로 삽입하라고한 InfiniteScroller를 return문안에서 적용하니 유효한 jsx 요소로서 사용할수 없다고 한다.설명에는 분명 return문안에 component로 끼워넣어져야 한다고 되어 있는데..흠흠.. 타입관련 오류가 나타나고 화면 렌더링에도 문제가 있었다.IDE에 나타나는 타입 관련 오류는 아래와 같은데, 'ref'속성이 없어서 JSX 컴퍼넌트로서 적용해 쓸수 없다는 의미이다. 'ref'는 React.component에서 상속되어 제공된다고 한다. 오류내용 : 'InfiniteScroll' ca..
CJS와 ESM 예전에 듣다가 중단했던 next 기초강의를 복기할 요량으로 듣고 있다.( 원래 지난해에 들었어야 했지만.. 이런 저런 사정이 있었다 )next를 이용한 프론트엔드와 express서버를 이용한 백엔드 구성에 대한 강의인데,수월히 넘어갈것 같던 프엔쪽이 ..점입가경이어서 아직까지 서버쪽으로 못 넘어가고 있다.강의 구매 후 2년여의 공백으로 적용되는 라이브러리의 버전이 당시와 많이 달라져,매 강의마다 버전으로 인한 시행착오가 생겼다. ( react를 17버전을 사용하는 강의에 그대로 따라가긴 뭣해서 react나 node외에 라이브러리 버전을 좀 더 최신화했더니, 초보에게는 뭔가 알수없는 오류의 연속.. )  ESLint 오류를 넘었더니 이번엔 antd이다. ㅎㅎㅎ ⊙ 에러 내용 1 of 1 error Next..
방송통신대 CS 마지막 학기의 후기 방송통신대의 2024년 2학기 CS막학기를 접으며, 각 과목의 강의에 대한 나의 경험을 조금 정리해 보고 올 한해를 리뷰해보고자 한다.  올해 들은 과목들 4-1 학기에는  정보통신망, 컴퓨터보안, 인공지능,데이터정보처리입문(데이터 통계학과과목이지만 CS커리큘럼에 있음), C프로그래밍, 파이썬 프로그래밍의 기초를 신청했고, 4-2 학기에는 복수전공을 고려하면서 CS는 딥러닝, 머신러닝, 빅데이터의 이해와 활용(데이터 통계학과과목이지만 CS커리큘럼에 있음)을 신청하고 데이터통계과학과 과목으로  바이오통계학, 파이썬 컴퓨팅, 데이터과학개론을 들었다.  1학기 신청 과목리뷰 (아래는 정확한 과목명은 아니지만 CS이시면 다들 아실듯 ^^)  정보통신망 : 손진곤 교수님이 수업하신다. 원리 위주로 파고드는 설명을..
Youtube 데이터 크롤링 빅데이터 수업을 들으면서 과제로서 데이터 수집이 있었다. 한동안 근무했던 기관에서 데이터를 수집하여 유해 정보를 추출하는 작업을 시도했었기에, 관련 방법을 적용하여 과제를 해보았다.  YouTube의 API v3에서 search에 검색어를 지정하는 쿼리를 사용했고,검색기간을 옵션으로 주었다. 데이터 저장하고 편집하는 작업이 번거로와서 구글 스프레드 시트에 바로 저장되도록 AppScript를 사용하여 연결했다.   -------------------------------------------------------------------------유튜브에서 관련 정보를 API로 수집하고 테이블로 정리해서 관련 업무 섹션에 공급하고,모니터 후 문제가 있는 부분을 유튜브쪽으로 통보해서 어떻게 처리되고 있는지 재..
심층 합성곱 신경망_ AlexaNet과 VGGNet16 Deep Learn수업을 들으며 관련 모델을 구현하고, 약간의 추가적인 진행을 해보았다.이틀에 걸쳐 진행했으며 구글의 Colab을 이용했고, GPU의 어마어마한 위력을 느낄수 있었다.  첫번째 시도는 여러모로 획기적인 모델이었던 AlexNet이다. ReLU함수를 처음으로 모델 적합에 시도하고, 병렬처리와 GPU로 연산에 소요되는 시간을 개선했다.또한 데이터에 대한 정규화의 개념을 도입하고 미러링, 랜덤크롭, PCA성분분석등을 통한 다양한 방법의데이터 증강을 시도했다. ( 드롭아웃도 적용된 모델이다 ) 교수님께서 적용하신 대로 CPU를 적용해서 10번의 에포크를 돌리려고 했으나 매번 연결이 끊어졌다.그도 그럴것이 에포크 당 50분이 걸렸다. 두번 시도했으나, 8번째 에포크를 넘기지 못했다.그런데, GPU로..
분류를 위한 도구 _ 단층 퍼셉트론 머신런의 기본이 되는 단층 퍼셉트론을 통계의 중선형회귀와 관련지어 이해해 보았다.  1. 단층 퍼셉트론과 중선형 회귀 중선형 회귀란 서로 다른 여러개의 특징을 독립변수로 하는 회귀의 결과를 판단하는 모형을 만드는 것이다. 가장 계산이 쉬운 단순선형회귀는 1개의 입력 특성으로 결과를 판단하는 것이고, 중선형회귀는 복수의 입력특성을 통해 최종 적합을 출력하는 선형회귀이다. 예를 들어 나이에 따른 혈압을 계산하는 것이 단순선형회귀라면, 나이와 몸무게를 입력으로 혈압을 추정하는것이 중선형 회귀이다. ( 이러한 수치 계산은 통계 Tool인 R을 이용하여 비교적 간편하게 수행할수 있다 ) 이를 확장하여 분류에 적용한다고 하자. 몸무게, 키등 연산이 가능한 수치값을 입력 변수로 하여 범주형 변수(수치로 계산이 불가한..
피그마 인터액션 모임 내 프로젝트의  피그마 쪽 화면의 기본적인 구조를 잡았다. 완성도 있게 프로토타입을 만들려면 공이 많이 들지만 그렇게 큰 프로젝트가 아니니 간단한 화면 구성만 했다.모바일 화면 구성할때를 대비해서 일단 컬럼과 로에 그리드를 주고 주요 내용을 가운데로 가능한 모으고 기본페이지 다섯 개 정도 만들어서 버튼이나 철자변경에는 약간의 인터액션을 추가해했고 전체적으로 Flow를 줬다. ( 영상을 만들다 보니, 오디션 옵션 선택의 상자를 닫는 인터액션을 안 준 부분이 눈에 띈다.. ㅜㅜ )    기본 버튼을 구성해서 component로 varient를 구성해서 넣고, hover나 onclick의 Interaction을주고 페이지간에도 Flow를 넣었다. 피그마는 디자인보다는 공유를 위한 프로토타입이나 목업을 만..
피그마_페이지의 기본 스타일 설정 스터디 내 프로젝트의  피그마 쪽 기본설정을 했다. 피그마의 이런저런 기능을 배우기는 했지만 사실상 혼자 과제를 하는것에 가까웠다.디자인 요소의 기본은 그냥 알아서 공부하리라 믿으셨는지 액션 설정에 대해서만 연습을 해서,오히려 기본적인 디자인 요소의 설정을 하려니 검색해서 해야 한다.  컴퍼넌트 구성했던 과제 (피그마에서 기본모듈의 트랜젝션 예제 구성함)팀 프로젝트때도 톤앤매너나 타이포의 기본 설정을 해본적이 없어, 유튜브를 보면서 다른 분들은 어떤방법을 사용하는지 둘러봤다.  1. 기본 색 설정 우리 프로젝트의 기본 Color :  F0EFEB, B51F38, 475D2E, 4F5B6A, 020204 1) Tailwind Plug-in으로 먼저 설정해봤다. 간편한데, 팔레트 생성이 없네. 안 멋지니깐 ..