본문 바로가기

전체목록

Lists of kipid's blog #[#Lists-of-kipid-s-blog] Lists of kipid's blog -->Fuzzy search 구현해놓음 : Fuzzy search 버튼이나 G 키 (G for Go to anything) 를 누르면 검색창 뜹니다. ESC 나 오른쪽 위 'x' 를 누르면 검색창이 닫힙니다. Fuzzy (흐릿한, 뿌연) search 가 어떤식으로 동작하는지는 쓰시면서 확인해 보시길... (뭐 장황한 설명보단 사용해 보시면서 느끼고, 익히시는게 더 이해가 잘 될듯 합니다. 음.. 한글 초성검색 및 한영 자동변환 검색도 구현해놓음.) Physics / Relativity / Tensor (Image by MidJourney) 블로그 글들 리스트를 정리해 놓은 것입니다. 제목뒤 날짜는 보통 처음 글을 올린 .. 더보기
12월 23일 2기 위클리 페이퍼 - VPC는 무엇이며, 왜 중요한가요? S3 버킷의 사용 사례와 주의할 점은 무엇인가요? IAM은 무엇이며, 어떤 기능을 제공하나요? # 12월 23일 2기 위클리 페이퍼 - VPC는 무엇이며, 왜 중요한가요? S3 버킷의 사용 사례와 주의할 점은 무엇인가요? IAM은 무엇이며, 어떤 기능을 제공하나요?## PH2024-12-23 : First posting.## TOC## VPC는 무엇이며, 왜 중요한가요?### VPC(Virtual Private Cloud)란 무엇일까요?VPC는 Virtual Private Cloud의 약자로, 퍼블릭 클라우드 환경 내에서 논리적으로 격리된 개인 네트워크를 의미합니다. 마치 자기만의 데이터 센터를 클라우드 상에 구축한 것처럼, 독립된 네트워크 환경을 제공하여 더욱 안전하고 유연하게 클라우드 서비스를 이용할 수 있도록 해줍니다.간단히 말해서, VPC는 클라우드 상의 '사설 네트워크'라고 생각하면 쉽습.. 더보기
12월 16일 2기 위클리 페이퍼 - AWS의 글로벌 instructure에는 어떤 구성 요소들이 포함되어 있나요? EC2 인스턴스란 무엇이며, 어떻게 사용하나요? # 12월 16일 2기 위클리 페이퍼 - AWS의 글로벌 instructure에는 어떤 구성 요소들이 포함되어 있나요? EC2 인스턴스란 무엇이며, 어떻게 사용하나요?## PH2024-12-18 : First posting.## TOC## AWS의 글로벌 instructure에는 어떤 구성 요소들이 포함되어 있나요?AWS의 글로벌 인프라스트럭처는 전 세계적으로 분산된 데이터 센터, 가용 영역, 리전, 엣지 로케이션 등으로 구성되어 있습니다. 이러한 구성 요소들은 고객에게 안정적이고 확장 가능하며 안전한 클라우드 서비스를 제공하는 기반이 됩니다. 주요 구성 요소는 다음과 같습니다.- 리전(Region): 지리적으로 분리된 독립적인 영역으로, 하나 이상의 가용 영역으로 구성됩니다. 각 리전은 자체적인 전력,.. 더보기
12월 09일 2기 위클리 페이퍼 - TypeScript의 동작 원리에 대해 설명해 주세요. d.ts 타입 정의파일이 무엇이며, 어떻게 만들 수 있는지 설명하세요. # 12월 09일 2기 위클리 페이퍼 - TypeScript의 동작 원리에 대해 설명해 주세요. d.ts 타입 정의파일이 무엇이며, 어떻게 만들 수 있는지 설명하세요.## PH2024-12-10## TOC## TypeScript의 동작 원리에 대해 설명해 주세요.TypeScript는 JavaScript의 슈퍼셋으로, JavaScript에 정적 타입을 추가한 언어입니다. 동작 원리를 이해하려면 다음 핵심 개념들을 알아야 합니다:1. 타입 시스템: TypeScript는 변수, 함수 매개변수, 반환 값 등에서 타입을 명시적으로 지정할 수 있게 합니다. 이로 인해 코드를 작성하는 도중에 타입 오류를 발견할 수 있으며, 더 나은 코드 품질과 유지 보수성을 제공합니다.```[.lang-ts]let myString:.. 더보기
코드잇 풀스택 2기 - Part 3 - 중급프로젝트 - Docthru # 코드잇 풀스택 2기 - Part 3 - 중급프로젝트 - Docthru개인 개발 리포트: 이강수 (kipid)## PH2024-12-06 : First posting.## TOC## npm install 에러시```npm install --legacy-peer-deps```/## font-size: var(--XXpx) 적극 활용## color, background-color: var(--prime-yellow/red/blue/orange) or var(--brand-black/white) or var(--gray-0 ~ 900) 적극 활용## queryClient.invalidateQueries({ queryKey: ['todos'] })캐싱 (Caching) 을 무효화 할 때 쓰는 명령어.## de.. 더보기
11월 11일 2기 위클리 페이퍼 - MVC(Model-View-Controller) 패턴이란 무엇인가요? 이 패턴의 각 구성 요소의 역할을 설명하고, MVC 패턴을 사용하는 이유와 그 장점에 대해 서술해주세요. OAuth란 무엇인가요? 그리고 왜 사용하는지 설명해주세요. # 11월 11일 2기 위클리 페이퍼 - MVC(Model-View-Controller) 패턴이란 무엇인가요? 이 패턴의 각 구성 요소의 역할을 설명하고, MVC 패턴을 사용하는 이유와 그 장점에 대해 서술해주세요. OAuth란 무엇인가요? 그리고 왜 사용하는지 설명해주세요.## PH2024-11-11## TOC## MVC (Model-View-Controller) 패턴이란 무엇인가요? 이 패턴의 각 구성 요소의 역할을 설명하고, MVC 패턴을 사용하는 이유와 그 장점에 대해 서술해주세요.MVC(Model-View-Controller) 패턴은 소프트웨어 디자인 패턴 중 하나로, 애플리케이션을 세 가지 주요 구성 요소로 분리하여 구조화하는 방식입니다. 각 구성 요소의 역할과 MVC 패턴의 장점에 대해 설명.. 더보기
11월 04일 2기 위클리 페이퍼 - 경험을 바탕으로 React 애플리케이션에서 JSON Web Token(JWT)을 사용하여 사용자 인증 시스템을 구현하는 방법에 대해 자세히 설명해주세요. 특히 로그아웃 구현 로직에 대해 설명해주세요. RESTful API의 개념과 주요 제약 조건을 설명하세요. # 11월 04일 2기 위클리 페이퍼 - 경험을 바탕으로 React 애플리케이션에서 JSON Web Token(JWT)을 사용하여 사용자 인증 시스템을 구현하는 방법에 대해 자세히 설명해주세요. 특히 로그아웃 구현 로직에 대해 설명해주세요. RESTful API의 개념과 주요 제약 조건을 설명하세요.## PH2024-11-05## TOC## React 애플리케이션에서 JSON Web Token(JWT)을 사용하여 사용자 인증 시스템을 구현하는 방법에 대해 자세히 설명### Front-End 단에서의 처리.```[.linenums]import axios from 'axios';const instance = axios.create({ // baseURL: `https://panda-market-api.ver.. 더보기
10월 28일 2기 위클리 페이퍼 - 세션 기반 인증과 토큰 기반 인증의 차이점을 설명하세요. 어떤 상황에서 각각을 사용하면 좋을지 예를 들어 설명해 주세요. # 10월 28일 2기 위클리 페이퍼 - 세션 기반 인증과 토큰 기반 인증의 차이점을 설명하세요. 어떤 상황에서 각각을 사용하면 좋을지 예를 들어 설명해 주세요.## TOC## 세션 기반 인증 (Session-Based Authentication)특징:서버가 사용자의 상태를 관리하고, 세션 아이디를 클라이언트에 전달합니다.세션 아이디는 쿠키에 저장되어, 클라이언트가 요청을 보낼 때마다 서버에 포함됩니다.서버는 세션 저장소를 사용하여 세션 아이디를 통해 사용자를 식별합니다.사용 상황:상태를 유지해야 하는 경우: 쇼핑카트와 같이 사용자 상태를 지속적으로 추적해야 하는 애플리케이션.보안이 중요한 애플리케이션: 세션 정보가 서버에 저장되므로, 서버 측에서 직접 관리할 수 있어 보안 관리가 용이합니다.브라우저 기.. 더보기
10월 21일 2기 위클리 페이퍼 (웹 페이지 렌더링 방식 CSR, SSR, SSG 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명, 리액트만 사용할 때와 비교해 Next.js를 사용하는 이유에 대해 설명) # 10월 21일 2기 위클리 페이퍼 (웹 페이지 렌더링 방식 CSR, SSR, SSG 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명, 리액트만 사용할 때와 비교해 Next.js를 사용하는 이유에 대해 설명)## PH2024-10-22## TOC## 웹 페이지 렌더링 방식 CSR, SSR, SSG 각각의 특징과 각 방식을 어떤 상황에 사용하면 좋을지 설명### CSR (Client-Side Rendering)특징:모든 렌더링이 클라이언트 측(브라우저)에서 이루어집니다.초기 로드 시 필요한 모든 JavaScript가 다운로드되어야 하므로, 초기 로딩 시간이 길어질 수 있습니다.이후 페이지 탐색은 빠르고 동적입니다.사용 상황:사용자와의 실시간 상호작용이 많은 SPA (Single Page App.. 더보기
엔트로피 (Entropy) 개념에 대한 이해 인데, 이 통계학적 논리에서는 열역학 제2법칙을 완전 절대적인 것이라고 설명하지 않음. 몇가지 공리로부터 시작해서 왜 엔트로피는 증가할 수 밖에 없는가?를 설명하게 되는데, 공리가 합당한 것인지도 고민해봐야 하고 결론으로 내놓은 것도 제대로 이해해야 함. 결론은 항상 증가한다는게 아니라 큰 수의 법칙에 의해 대부분이 그렇다는 것임. 더 깊이 들어가면 엔트로피가 증가하게 되는 시간의 방향성이란게 어떻게 정해지는 것인가?, 우리와는 반대 방향의 시간으로 늙어가는 (엔트로피가 증가하는) 생명체나 계 (system or sub-universe) 가 우리 우주안에 공존할 수 있을까? 등의 질문도 나오게 되면서 양자역학이랑도 섞이고 꽤 복잡한 논의가 필요하게 됨. 아직 엔트로피 관련해서도 풀리지 않은 것들이 많음... 더보기
ESLint & Prettier: Format Document (JavaScript, React styles 통일시키기) # ESLint & Prettier: Format Document (JavaScript, React styles 통일시키기)Airbnb Style Guide 가 유명해서 이 가이드대로 .js, .jsx 파일들이 포멧화되도록 설정을 해보려고 함.## PH2024-09-27 : First posting.## TOC## ESLint, Prettier 패키지 설치ESLint (EcmaScript Lint) 는 JavaScript에 한정된 Code Formatter (문법이 제대로 맞는지 주로 판단) 라면, Prettier 는 전체 코드 스타일을 다루는 Code Formatter (코드 스타일을 통일시켜주는 일을 주로 함) 이다.```[.scrollable]npm install --save-dev --save-.. 더보기
Sign-up/Log-in with Google/Kakao (구글/카카오로 가입하기/로그인 구현하기): 구글 Google, 카카오 Kakao Oauth # Sign-up/Log-in with Google/Kakao (구글/카카오로 가입하기/로그인 구현하기): 구글 Google, 카카오 Kakao Oauth구글로 가입하기랑 로그인하기를 어떻게 구현할 수 있는지 알아봅시다.작성중...## PH2024-09-30 : First posting.## TOC## 구글로 가입하기### 우선 console 로 가서 Oauth 를 활성화시켜 줍시다. (Google Developers)https://console.cloud.google.com/ 로 가서 My First Project 링크로 들어갑시다.왼쪽 사이드바에서 APIs & Services > Credentials 를 클릭. OAuth 2.0 Client IDs 를 하나 발급 받읍시다.여기서 Authorized J.. 더보기