방구석 코딩쟁이
close
프로필 배경
프로필 로고

방구석 코딩쟁이

  • 분류 전체보기 (83)
    • 프로그래밍 언어 (1)
      • Typescript (1)
      • Javascript (0)
    • 프론트엔드 개발 (15)
      • React (8)
      • Next.js (1)
      • 개발환경 (4)
    • 백엔드 개발 (5)
      • Node.js&Nest.js (5)
    • 프로그래밍 방법론 (12)
      • 함수형 프로그래밍 (5)
      • 객체지향 프로그래밍 (0)
      • 테스트코드 (2)
      • 디자인패턴 (1)
      • 도메인 주도 설계 (4)
      • 아키텍처 (0)
    • 개발환경 (3)
      • Docker (2)
      • Git (1)
      • 클라우드 (0)
    • CS지식 (14)
      • 알고리즘 (0)
      • 자료구조 (1)
      • 데이터베이스 (0)
      • 네트워크 (11)
      • 운영체제 (0)
      • 코딩테스트 (2)
    • 프로젝트들 (5)
      • 졸업작품 (3)
    • Life (14)
      • 계획 (0)
      • 회고 (12)
      • 독후감 (1)
    • 수학 (0)
      • 통계학 (0)
      • 선형대수학 (0)
  • 홈
백준 10026 - 적록색약

백준 10026 - 적록색약

문제적록색약은 빨간색과 초록색의 차이를 거의 느끼지 못한다. 따라서, 적록색약인 사람이 보는 그림은 아닌 사람이 보는 그림과는 좀 다를 수 있다.크기가 N×N인 그리드의 각 칸에 R(빨강), G(초록), B(파랑) 중 하나를 색칠한 그림이 있다. 그림은 몇 개의 구역으로 나뉘어져 있는데, 구역은 같은 색으로 이루어져 있다. 또, 같은 색상이 상하좌우로 인접해 있는 경우에 두 글자는 같은 구역에 속한다. (색상의 차이를 거의 느끼지 못하는 경우도 같은 색상이라 한다)예를 들어, 그림이 아래와 같은 경우에RRRBBGGBBBBBBRRBBRRRRRRRR적록색약이 아닌 사람이 봤을 때 구역의 수는 총 4개이다. (빨강 2, 파랑 1, 초록 1) 하지만, 적록색약인 사람은 구역을 3개 볼 수 있다. (빨강-초록 2..

  • format_list_bulleted CS지식/코딩테스트
  • · 2024. 7. 17.
  • textsms

2024년도 1학기 회고

이번 학기에 내가 도대체 뭘 했는지, 어떤 점이 아쉬웠는지 파악해 보고자 회고를 남기려고 합니다.  개발 일정 1. 연구실에서 하는 프로젝트 연구실에서 진행 중인 프로젝트에 현직 개발자 분께서 참여하시게 되어 코드 내, 외적으로 배울 수 있었던 것 같습니다.  2. 졸업작품졸업작품은 현재 순조롭게 가는 것 같지만 배포 프로세스를 간소화시켜야겠다는 생각은 하고 있습니다. 3. 항해 플러스 프론트엔드 1기 수료 항해 플러스 프론트엔드를 갔다오면서 시야가 더 확장이 되었습니다. 개발적인 열정이 가득한 분들을 보며 내가 이 길을 선택한 것을 잘한 건가라는 생각도 하고, 어떤 일을 하더라도 좀 더 꼼꼼해야겠다는 생각이 들었습니다. (시간 내에 개발을 완료하는 것도 중요하지만 내가 개발한 부분에 대해 책임지고, 발..

  • format_list_bulleted Life/회고
  • · 2024. 7. 15.
  • textsms
Three.js 공부하기 1 - 기본 파일 세팅하기

Three.js 공부하기 1 - 기본 파일 세팅하기

1. 초기 세팅하기 먼저 vite를 이용해서 vanilla TS 파일을 만들어보자. 다음 명령어를 통해 Vanilla + TS 프로젝트의 초기 세팅의 도움을 받을 수 있다.npm create vite@latest . 그리고 three.js 관련 의존성을 설치해주자. npm i three --save TypeScript를 쓸 것이고, Three.js에서는 아직 별도의 d.ts 파일을 제공해주지 않기 때문에 @types/three를 설치해주도록 하자npm i --save-dev @types/three 이렇게 되면 초기 설정은 다 되었다. 2. 코드 작성이제 코드를 작성해보도록 하자.먼저 필요한 속성들과 생성자들을 작성해보도록 하자.class App { private renderer: THREE.WebGLR..

  • format_list_bulleted 프론트엔드 개발
  • · 2024. 6. 26.
  • textsms

포트폴리오 사이트 제작기 1탄: React SEO 최적화하기에서 발생한 문제와 그 해결 과정

1. SEO 최적화 코드가 배포시에 동작하지 않았던 문제SEO 최적화를 위한 코드는 다음과 같았습니다. import { defineConfig, loadEnv } from "vite";import react from "@vitejs/plugin-react";import prerender from "@prerenderer/rollup-plugin";import puppeteerRenderer from "@prerenderer/renderer-puppeteer";export default defineConfig(({ mode }) => { const env = loadEnv(mode, process.cwd(), ""); return { plugins: [ react(), prere..

  • format_list_bulleted 프로젝트들
  • · 2024. 6. 19.
  • textsms
Nginx / AWS EC2를 활용하여 React와 Node 서버 배포해보기 3탄 - CI / CD 및 CORS 이슈 해결

Nginx / AWS EC2를 활용하여 React와 Node 서버 배포해보기 3탄 - CI / CD 및 CORS 이슈 해결

CI / CD란 무엇일까?Continuous Integration은 영역별로 나눠서 개발할 때, 인터페이스 등의 충돌을 미리 발견하기 위해 매일 또는 매시간 저장소를 자동으로 빌드하는 개념이다. Continuous Delivery는 저장소 코드의 변경이 발생하면 개발 서버 또는 운영계에 자동으로 배포하는 작업이다. CI/CD 파이프라인의 구성요소버전 관리 시스템: 코드 저장소Git: 소스 코드를 관리하고 변경 사항을 추적하는 분산 버전 관리 시스템CI 서버: 코드 변경 사항을 자동으로 빌드하고 테스트하는 서버 Jenkins: 오픈 소스 자동화 서버. (다양한 플러그인을 통해 빌드, 테스트, 배포 파이프라인을 구성할 수 있음)Travis CI: Github 프로젝트와 통합하여 빌드, 테스트, 배포를 자동화..

  • format_list_bulleted 프론트엔드 개발/개발환경
  • · 2024. 6. 17.
  • textsms
Nginx / AWS EC2를 활용하여 React와 Node 서버 배포해보기 2탄

Nginx / AWS EC2를 활용하여 React와 Node 서버 배포해보기 2탄

이제는 도메인 주소를 구입하고, 이 도메인 주소를 EC2 인스턴스와 연결을 시켜보도록 해보자 1. 도메인 주소 구입하기Route 53 서비스로 이동해서 좌측의 "등록된 도메인"을 눌러서 이동해보면 아래와 같은 화면이 뜬다. 여기서 도메인 등록 버튼을 눌러서 원하는 도메인을 만들자 (돈은 일년에 $14 정도 든다고 나온다) 도메인을 구입하면 "진행 중" 상태가 뜨는 것을 볼 수 있다. 이메일 인증을 마치고 1시간 정도 기다리게 되면 상태가 성공으로 바뀌는 것을 볼 수 있다.이제 구입한 도메인과 우리의 EC2 인스턴스를 연결할 때가 온 것이다.2. 도메인 주소와 EC2 인스턴스와 연결 좌측의 "호스팅 영역"에 들어가게 되면 아래와 같은 화면이 생성된다. 여기서 호스팅 영역 이름을 클릭하게  되면 다음과 같은..

  • format_list_bulleted 프론트엔드 개발/개발환경
  • · 2024. 6. 14.
  • textsms
  • navigate_before
  • 1
  • ···
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • ···
  • 14
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (83)
    • 프로그래밍 언어 (1)
      • Typescript (1)
      • Javascript (0)
    • 프론트엔드 개발 (15)
      • React (8)
      • Next.js (1)
      • 개발환경 (4)
    • 백엔드 개발 (5)
      • Node.js&Nest.js (5)
    • 프로그래밍 방법론 (12)
      • 함수형 프로그래밍 (5)
      • 객체지향 프로그래밍 (0)
      • 테스트코드 (2)
      • 디자인패턴 (1)
      • 도메인 주도 설계 (4)
      • 아키텍처 (0)
    • 개발환경 (3)
      • Docker (2)
      • Git (1)
      • 클라우드 (0)
    • CS지식 (14)
      • 알고리즘 (0)
      • 자료구조 (1)
      • 데이터베이스 (0)
      • 네트워크 (11)
      • 운영체제 (0)
      • 코딩테스트 (2)
    • 프로젝트들 (5)
      • 졸업작품 (3)
    • Life (14)
      • 계획 (0)
      • 회고 (12)
      • 독후감 (1)
    • 수학 (0)
      • 통계학 (0)
      • 선형대수학 (0)
최근 글
인기 글
최근 댓글
태그
  • #React
  • #HTTP 완벽가이드
  • #항해
  • #MFA
  • #마이크로 프론트엔드
  • #항해플러스
  • #ci/cd
  • #http
  • #항해99
  • #테스트코드
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바