개발 회고 창고 개발 회고 창고

Today I Learned 2022. 4. 6. 수 리액트 라우팅 리액트 라우팅 리액트 라우팅 미치겠다. 차라리 Node로 하고 싶다... 사수 분께서 코로나 걸리셔서 맨땅에 헤딩 중이다. 궁금하거나 모르는 거 있으면 언제든지 연락을 하라고 하셨지만 아는 게 없어서 못 여쭤보겠다. 항해를 했을 때 리액트 주특기 하시던 분들이 왜이렇게 힘들어 하시는지 알 것 같다. 어제 분명 구글링으로 리액트 기초 실습을 보면서 했을 때는 어느정도 감은 잠혔던 것 같은데... 막상 적용을 하려니까 이게 뭐여... 모니터만 쳐다보면서 구상을 하다 오전을 다 날렸다. 강의를 하나 사서 들어야하나 생각도 했는데, 주 개발하는게 서버다 보니 강의를 사는 것도 좀 그렇고 하지만 여쭤볼 분이 없으셔서 강의 안 사는 것도 그렇고 미..

라우팅 웹 어플리케이션에서 라우팅이라는 개념은 사용자가 요청한 URL에 따라 알맞는 페이지를 보여주는 것을 의미한다. 리액트에서 라우트 시스템을 구축하기 위해서 사용할 수 있는 방법은 크게 두가지가 있다. 리액트 라우터(React Router) 리액트의 라우팅 관련 라이브러리 중 가장 오래됐고, 가장 많이 사용한다. 이 라이브러리는 컴포넌트 기반으로 라우팅 시스템을 설정할 수 있다. Next.js 리액트 프로젝트의 프레임워크다. Next.js는 사용했던 Create React App처럼 리액트 프로젝트 설정을 하는 기능, 라우팅 시스템, 최적화, 다국어 시스템 지원, 서버 사이드 렌더링 등 다양한 기능들을 제공한다. Next.js 라우팅 시스템은 파일 경로 기반으로 작동한다. Next.js는 리액트 라우..

npm init pakage.json 생성 yarn add create-react-app 리액트 개발을 위한 시작 과정 npm install -g yarn yarn을 개발 공간에 전역으로 설치 yarn add create-react app yarn add -D create-react-app 리액트 디렉토리 구조 생성 npx create-react-app . 리액트 개발 환경 구성 yarn start

Today I Learned 2022. 4. 5. 화 어드민 퉅 개발을 위해서 간단한 뷰작업이 필요해서 이번주는 한번도 해보지 못한 리액트를 공부 중이다. 사수 분께서 정말 간단한 과제를 내주셨지만 JSX가 아닌 TSX로 하려니 어렵다... JS도 간신히 하는데 JSX도 모른체로 TSX를 하려니 하나도 못 건드렸다. 우선은 리액트 기초 중에 기초인 리액트에 대해서 공부를 했고, 내가 사용을 해봤던 HTML, CSS, JS 이런 것들과는 다른 점이 렌더링이 알아서 된다는 점을 제일 크게 알게 됐다. Node.js도 벅찼는데 React도 하려니 뭔가 강의를 좀 들어봐야 할 것 같다. 우선 출근해서는 구글링을 통해서 좀 배워보도록 하고, 퇴근하고 집에가서 유튜브로 간단한 강의라도 좀 봐야 건들 수 있을 것 같..

React 웹 프레임워크로, JavaScript 라이브러리의 하나로써 사용자 인터페이스를 만들기 위해 사용한다. React는 FaceBook에서 제공해주는 Front-End 라이브러리라고 볼 수 있다. 싱글 페이지 어플리케이션(SPA)이나 모바일 어플리케이션 개발 시 주로 사용한다. React 특징 Data Flow React는 데이터의 흐름이 한 방향으로만 흐르는 단방향 데이터의 흐름을 가진다. Component 기반 구조 Component는 독립적인 단위와 소프트웨어 모듈을 말한다. 즉, 소프트웨어를 독립적인 하나의 부품으로 만드는 방법이라고 볼 수 있다. React는 View를 여러 Component를 쪼개서 만든다. 한 페이지 내에서도 여러 각 부분을 독립된 Component를 만들며, 이 Com..

Today I Learned 2022. 4. 4. 월 취업에 성공해서 첫 출근을 했다. 첫 출근을 해서 세팅을 하다보니 오전이 지나고 사내 일정대로 움직이다 보니 시간이 쭉 지나갔다. 입사 전 항해에서 배운 것들을 다시 기초부터 차근차근 배우고 있다. 어드민 관련 개발도 하다보니 프론트도 해야해서 리액트랑 뷰 중에서 고른 결과 리액트를 하게됐다. 엄청 잘 만드는 것 까지는 아니고 내가 만든 서버가 잘 동작하는지 테스트 할 수 있을 정도...? 오랜만에 들어보는 서버 사이드 렌더링이랑 싱글 페이지 어플리케이션 등 잊고 있던 것 들을 다시 들으면서 이해를 해가고 있다. 신입으로서 보여주고 싶은거는 많지만 아직 보여줄게 없다는 걸 아셨는지 기초를 닦는 중이다. 내일 할 일을 정해주셔서 리액트 기초를 좀 다루면..

인덱스(INDEX) 데이터베이스 테이블에 대한 검색 성능의 속도를 높여주는 자료구조 특정 컬럼에 인덱스를 생성하면, 해당 컬럼의 데이터들을 정렬하여 별도의 메모리 공간에 데이터 물리적 주소와 같이 저장된다. 인덱스(INDEX)를 사용하는 이유 조건 검색 WHERE 절의 효율성 테이블 안에 데이터들이 쌓이게 되면 테이블의 레코드는 내부적으로 순서가 뒤죽박죽 저장이 된다. 이렇게 되면 WHERE절의 특정 조건에 맞는 데이터들을 찾아낼때도 레코드의 처음부터 끝까지 다 읽어서 검색 조건과 맞는지 비교해야 한다. 이것을 Full Table Scan이라고 한다. 하지만 인덱스 테이블은 데이터들이 정렬되어 저장이 되어 있어서 해당 조건(WHERE)에 맞는 데이터들을 빠르게 찾아낼 수 있다. 이것이 인덱스(INDEX)..

Weekend I Learned 22년 3월 4주차 이번주는 거의 지원한 회사 면접으로 흘러갔던 주였다. 타이트한 일정으로 공부할 양도 부족했고, 면접을 준비하기에도 부족했었다. 면접을 보기전에 면접을 볼 회사 홈페이지나 유튜브들을 찾아봤던 것 같다. 최소한 어떤 회사인지는 알고가는 것이 예의인 것 같아서 찾아보면서 화사에 대해 궁금한 질문들을 추렸던 것 같다. 면접을 보면서 다음 날 면접볼 곳을 대비하며 받았던 질문들을 정리를 하면서 부족했던 점을 회고 했던 것 같다. 이번 면접은 CS지식보다는 여태 내가 해왔던 프로젝트 관련 기술면접이라서 CS지식을 공부를 많이했던 터라 처음 본 회사에서는 시간이 흘러도 너무 흘러버린 프로젝트 관련 질문들을 받았을 때 생각을 좀 많이 했던 것 같다. 피드백을 받았다면..