전체 글 224

[백준 2480] 주사위 세개

입력 & 출력 예제 n = list(map(int, input().split())) c = {} for i in n: c[i] = n.count(i) s = max(c, key=c.get) m = max(c.values()) if m == 3: print(10000 + s * 1000) elif m == 2: print(1000 + s * 100) else: print(s * 100) 입력 값을 모두 리스트 형식으로 받고 각 항목의 개수를 c 딕셔너리에 넣었다. 그리고 같은 눈이 나오는 수를 max 함수를 통해 m 변수에 넣었고 같은 눈이 나오는 수를 s 변수에 넣는 형식으로 풀이를 했다. 예제 출력은 제대로 나오지만 틀렸다고 나와서 검색해보니 생각보다 간단하게 풀고 있다.. 너무 복잡하게 생각한 것 같..

[Airbnb 클론코딩] Register & Login functionality

2023.06.17 - [Project/Airbnb Clone] - [Airbnb 클론코딩] Auth UI [Airbnb 클론코딩] Auth UI 2023.06.11 - [Project/Airbnb Clone] - [Airbnb 클론코딩] 환경설정 및 Navbar UI(With. Youtube) [Airbnb 클론코딩] 환경설정 및 Navbar UI(With. Youtube) 유튜브를 보던 중에 Airbnb 클론코딩을 하는 것을 보았다. 그래서 Next. hu-bris.tistory.com Prisma setup 기능 구현에 들어가기 앞서 Prisma를 설치해야 한다. Prisma는 자바스크립트와 타입스크립트 커뮤니티에서 주목받고 있는 차세대 ORM(Object Relational Mapping) 프레임..

[Airbnb 클론코딩] Auth UI

2023.06.11 - [Project/Airbnb Clone] - [Airbnb 클론코딩] 환경설정 및 Navbar UI(With. Youtube) [Airbnb 클론코딩] 환경설정 및 Navbar UI(With. Youtube) 유튜브를 보던 중에 Airbnb 클론코딩을 하는 것을 보았다. 그래서 Next.js를 찍먹해보려고 한다. 환경설정 해당 영상에서는 Next.js 13, React, Tailwind, Prisma, MongoDB를 사용한다. 먼저 Next 프로젝트 폴더를 hu-bris.tistory.com Auth UI 에어비앤비의 로그인과 회원가입 페이지는 Modal 창을 이용해서 구현되어 있다. 그래서 모달 창을 만들어주기 위해 Modal 컴포넌트를 만들어준다. 'use client'; i..

[Airbnb 클론코딩] 환경설정 및 Navbar UI(With. Youtube)

유튜브를 보던 중에 Airbnb 클론코딩을 하는 것을 보았다. 그래서 Next.js를 찍먹해보려고 한다. 환경설정 해당 영상에서는 Next.js 13, React, Tailwind, Prisma, MongoDB를 사용한다. 먼저 Next 프로젝트 폴더를 만들어준다. npx create-next-app --typescript 이렇게 하면 기본 셋팅을 물어보는 것이 있는데 초기 설정 값으로 설정하면 된다. 프로젝트 폴더가 만들어지면 npm run dev를 통해 실행해주면서 localhost:3000으로 들어가면 된다. Navbar 먼저 완성된 디렉터리 구조는 이러하다. 📦app ┣ 📂components ┃ ┣ 📂navbar ┃ ┃ ┣ 📜Logo.tsx ┃ ┃ ┣ 📜MenuItem.tsx ┃ ┃ ┣ 📜Navb..

[Next.js] Next.js 13 font 적용

Next.js를 찍먹해보면서 알게 된 font 적용 Next.js를 이제 사용해봐서 이전 버전이 어떻게 되어 있는지는 모르겠지만 지금까지 구글 font cdn을 통해 css를 적용했었다. Next.js 13버전을 보니 훨씬 더 간편하게 사용할 수 있는 것 같아 적어본다. 자동 호스팅 브라우저에서 따로 Google에 요청을 보내지 않는다고 한다. 그러면서 성능 측에서 향상되었다. 모든 Google 글꼴을 자동으로 자체 호스팅합니다. next/font/google 함수로 사용하려는 글꼴을 가져와서 시작하면 된다. 사용법 import { Nunito } from 'next/font/google'// nunito 폰트 가져오기 const font = Nunito({ subsets: ["latin"] }) {ch..

기타/WEB 2023.06.10

[JavaScript] 문자열을 숫자로 변환하기

parseInt() parseInt(string, radix) 파라미터로 숫자로 변환할 문자열과 수로 전환할 진법으로 하고 있다. 더하기 (+) 연산자 숫자로 변환할 문자열 앞에 + 연산자를 붙여주면 Number 타입으로 변환된다. console.log(+"10"); // 10 console.log(+"10.1"); // 10.1 console.log(+"-10"); // -10 console.log(+"abc"); // NaN console.log(+true); // 1 console.log(+false); // 0 곱하기 (*) 연산자 console.log("10" * 1); // 10 console.log("10.1" * 1); // 10.1 console.log("-10" * 1); // -10 ..

기타/WEB 2023.06.05

NestJS로 API 만들기 (Feat. TypeScript)

nomadcoder를 통해서 영화 API를 만들어보면서 API를 NestJS에 대해 학습할 계획. SetUp nest-cli를 통해 모듈과 서비스를 간단하게 생성할 수 있다. nest g co 위 커맨드를 입력하면 만들 컨트롤러의 이름을 정하라고 나온다. 나는 movies라는 이름으로 정했다. 이렇게 되면 movies라는 폴더가 생길 것이고 안에 컨트롤러 파일이 생성되어 있을 것이다. 또한 앱 모듈 파일에 컨트롤러가 들어가져 있는 것을 볼 수 있다. 그리고 Rest API를 쉽게 테스트할 수 있게 도와주는 insomnia 프로그램을 사용한다. Movies Controller 간단한 Movie의 CRUD를 작성해보자. 먼저 모든 영화를 가져오기 위한 getAll @Get() getAll() { return..

BACKEND/NestJS 2023.06.05

TypeScript 기본 개념 공부 #5

2023.04.08 - [Language/TypeScript] - TypeScript 기본 개념 공부 #4 TypeScript 기본 개념 공부 #4 2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #3 TypeScript 기본 개념 공부 #3 2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #2 TypeScript 기본 개념 공부 #2 Call Signatures 2023.04.04 - [Language/Typ hu-bris.tistory.com Interface 인터페이스는 타입과 비슷하지만 다른 부분이 있다. type User = { name: string, age: number, gender:..

Language/TypeScript 2023.04.12

Gitea 메일러 기능 및 로그 #4

2023.03.18 - [Project/개인 깃허브 제작] - Gitea 로고 및 파비콘 변경 #3 Gitea 로고 및 파비콘 변경 #3 2023.03.18 - [Project/개인 깃서버 제작] - Gitea 테마 적용 #2 Gitea 테마 적용 #2 2023.03.11 - [Project/개인 깃서버 제작] - 개인 Github 제작(Gitea) #1 개인 Github 제작(Gitea) #1 프로젝트 진행 사유 해당 프로젝트는 hu-bris.tistory.com Mailer Mailer 기능이 무엇인가? 기능 추가를 했으면 싶어 찾아보는 중에 메일러 기능을 알게 되었다. 메일러 기능을 깃허브를 해보면 메일로 알림이 오는 것을 본 적이 있을 것이다. 그 기능이 있으면 좋겠다 싶어 메일러 기능을 추가하기..