본문 바로가기

[IT/Programming]

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)특징:서버가 사용자의 상태를 관리하고, 세션 아이디를 클라이언트에 전달합니다.세션 아이디는 쿠키에 저장되어, 클라이언트가 요청을 보낼 때마다 서버에 포함됩니다.서버는 세션 저장소를 사용하여 세션 아이디를 통해 사용자를 식별합니다.사용 상황:상태를 유지해야 하는 경우: 쇼핑카트와 같이 사용자 상태를 지속적으로 추적해야 하는 애플리케이션.보안이 중요한 애플리케이션: 세션 정보가 서버에 저장되므로, 서버 측에서 직접 관리할 수 있어 보안 관리가 용이합니다.브라우저 기.. 더보기
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.. 더보기
DATABASE setup of View My StartUp # DATABASE setup of View My StartUpdb error 가 날 땐,```[.linenums]npx prisma migrate reset --force```/후 다시```[.linenums]npm install --production && npx prisma migrate deploy && npx prisma generate && npx prisma db seed```/## PH2024-09-26 : First posting.## TOC## ERD models### model 1### model 2## Schema 모음.User: Company: Watch and Comparison: Investment: ## UserUser```[.linenums]model User { id.. 더보기
Git 을 배워보자. (Feat. GitHub) # Git 을 배워보자. (Feat. GitHub)버전 관리와 협업에 필수인 Git (and GitHub) 에 대해 배워봅시다. ## PH2024-07-30 : First posting.## TOC## Git 설치 및 간단한 명령어들Git 은 (Global Information Tracker) 의 약자로 대충 보면 된다. (처음 이름 지은 사람은 이런 의도를 가진 약자가 아니었던 같긴 한데... 저 표현이 Git 을 잘 나타내준다고 본다.)우선 설치: 에서 다운 받고 대충 설치.```[.scrollable]SET BASEDIR=%CD%set GIT_EDITOR=vimset VISUAL=vimset EDITOR=%VISUAL%git config --global core.editor "vim"git con.. 더보기
코드잇 풀스택 2기 초급 프로젝트 (1팀): View My Startup # 2기-View-My-Startup-PART-2-1팀웹 상의 현재 문서는 https://view-my-startup-by-team-1.netlify.app/static/2%EA%B8%B0-view-my-startup-1%ED%8C%80 에 있습니다.코드잇 풀스택 2기 초급 프로젝트 (1팀): View My Startup .노션 (Notion): . (feature & schema)스타일 가이드 참고: .Commit message Convention 참고: [Git] 커밋 메시지 컨벤션(스타일) 가이드 / Commit message Convention(style) guideUdacity Git Commit Message Style Guide.React.js Naming Convention: React J.. 더보기
prisma with PostgreSQL - cursor based pagination # prisma with PostgreSQL - cursor based pagination페이지값을 넘겨주어 글들을 가져오는 offset based pagination 과는 달리 넘겨준 마지막 아이템을 이용해서 pagination을 하는 방식. Offset based 에 비해 장점을 많이 가지고 있어서 사용법을 정리할 겸 포스팅.## PH2024-09-25 : First posting.## Cursor based pagination 의 장단점장점1. 데이터 양이 커져도 영향을 적게 받는다. (@@index 필수적)2. 데이터가 중간에 만들어지거나 사라져도 영향을 적게 받는다. (Cursor 에 해당하는 entity 가 사라지면 안됨.)단점1. 키가 정렬이되 있는 숫자여야 한다. (@@index 필수적)2.. 더보기

티스토리툴바