분류 전체보기

이 글에서는 CSS가 아닌 styled-components 라이브러리를 이용해 리액트 어플리케이션의 스타일링 방법에 대해 알아본다. styled-components란 무엇인가 styled-components는 리액트의 디자인을 보다 쉽게 하기 위해 개발된 패키지로, 별도의 CSS 파일을 이용하여 스타일을 적용하는 것이 아니라 컴포넌트 내에서 스타일을 지정할 수 있도록 도와주는 패키지이다. 리액트와 같은 프레임워크는 재활용 가능한 컴포넌트 단위로 분할하여 개발이 이루어지고 있는데, 리액트에서는 이미 HTML은 JSX를 이용하여 포함하고 있으며, styled-components 패키지를 이용하면 CSS 역시 별도의 CSS 파일이 아닌 JavaScript(JSX) 혹은 TypeScript(TSX) 내에 포함하..

이 글에서는 creat-react-app와 다른 방법으로 리액트 프로젝트를 생성하는 Vite(비트)를 설치하고 리액트 프로젝트를 생성하는 방법에 대해 정리할 예정이다. Vite 설치하기 Vite는 Node.js 버전 18+ 혹은 20+를 기본 요구사항으로 하고 있다. 먼저 Node.js가 설치되어 있지 않다면 설치를 진행하고, 설치가 되어있다면 버전을 확인하자. node -v 버전이 낮거나 설치가 되어있지 않다면 아래 사이트로 이동해서 설치를 진행하면 된다. https://nodejs.org/en Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org Vite 프로젝트 생성하기 프로젝트 생성은 아..

이 글에서는 이산형 확률 분포(이항 분포, 포아송 분포)와 연속형 확률 분포(정규분포, 표준정규분포)에 대해 빠르게 알아보는 글이다. 공식에 대한 유도나 증명 과정은 생략한다. 이산형 확률 분포 이산형 확률 분포(discrete probability distribution)는 이산형 확률 변수(discrete random variable)에 대한 확률 분포를 의미한다. 여기서 이산형(discrete)이란 대소 비교의 의미가 있는, 셀 수 있는 정수 자료형을 의미한다. 예를 들면 자녀 수, 사고 횟수, 제품의 개수 등이 이산형 확률 변수에 속한다. 이산형 변수 \( X \)의 모든 실현 가능한 실현치 \( x_1, x_2, \cdots \)에 대해 확률 질량(확률) \( f(x_1) = P(X = x_1)..

이 글에서는 확률의 기본 내용에 대해 정리하고, 사전 확률을 이용하여 사후 확률을 계산하는 베이즈 정리(Bayes' rule)에 대해 알아본다. 확률 용어 정리 먼저 확률에서 사용되는 용어에 대해 정리한다. 확률 실험 (random experience) 확률 실험은 실행 이전에 그 결과를 정확하게(100%) 예측할 수 없는 실험을 의미한다. 만약 연구자가 하고자 하는 연구가 확률 실험이 아니라면, 통계학을 적용할 수 없다. 확률 실험은 동일한 조건으로 실험을 반복하더라도 그 실험의 결과가 동일하지 않고 임의의 형태로 나타난다는 특징이 있다. 동전 던지기, 주사위 굴리기 등이 확률 실험에 포함된다. 표본 공간 (sample space) 표본 공간은 확률 실험을 통해 얻어지는 가능한 모든 결과들의 집합을 의..

이번 글에서는 리액트로 만든 프로젝트를 GitHub page로 배포하는 방법에 대해 정리해보고자 한다. GitHub page라고 한다면 https://{user_name}.github.io와 같은 주소를 사용하는 GitHub을 통해 배포하는 개인 홈페이지, 일종의 블로그를 의미한다. (모든 것을 직접 만들어야하니 블로그보다는 홈페이지에 가깝다고 할 수 있다. 다만 이를 GitHub 블로그로 사용하는 사용자들이 많을 뿐...) 해당 프로젝트는 npx create-react-app 커맨드를 이용하여 생성된 프로젝트이다. 그럼 바로 알아보러 가자. GitHub Page로 리액트 프로젝트 배포하기 GitHub repository 생성 먼저 해당 프로젝트가 GitHub에 업로드되어 있지 않는다면, 해당 프로젝트가..