Toris Blog
홈
블로그
할일 관리
소개
문의
홈
블로그
할일
소개
문의
로딩 중...
Toris Blog

Next.js, React, TypeScript로 만드는 모던 웹 개발 블로그

페이지

소개블로그

소셜

© 2026 Toris-dev. All rights reserved.

블로그 검색

원하는 키워드로 블로그 포스트를 검색해보세요.

총 46개의 결과를 찾았습니다

46개의 검색 결과

Projects

[Career] 21앤에서 보낸 풀스택 1년 차 — 고충과 배운 점

21앤에서 보낸 풀스택 1년 차 — 고충과 배운 점 > 저는 21앤에서 React Native(Expo), NestJS·tRPC, Next.js, 그리고 AWS·Terraform까지 맡는 풀스택으로 일하고 있습니다. > 이 글은 서비스 스펙 나열이 아니라, 1년...

2026년 5월 4일
#Career#FullStack+11
Projects

[Career] 21앤(21n) — 병원 시술 전자계약 B2B2C 플랫폼에서 풀스택으로 일하며

21앤(21n) — 병원 시술 전자계약 플랫폼 > 병원과 모델(사용자)을 연결하고, 전자계약·포인트·쿠폰·알림을 한곳에서 다루는 B2B2C 올인원 서비스입니다. > 저는 풀스택 개발자로 React Native(Expo) 앱, NestJS 기반 API, Next....

2026년 5월 3일
#React Native#Expo+11
Personal

Thiel Fellowship의 철학을 본받아 1인 개발자로 성장하기

Thiel Fellowship의 철학을 본받아 1인 개발자로 성장하기 들어가며 최근 Thiel Fellowship에 대해 알게 되었습니다. Peter Thiel이 만든 이 프로그램은 20세 이하의 젊은 기업가들에게 대학을 중단하고 창업에 집중할 수 있도록 $10...

2026년 1월 22일
#개발자 성장#1인 개발자+3
Career

[Career] 면접 기술 질문 정리 - JavaScript와 알고리즘 기초

면접 기술 질문 정리 - JavaScript와 알고리즘 기초 > 오늘 면접을 봤는데, 기술 질문에서 제대로 대답을 못했습니다. 요즘 AI를 활용해서 개발을 진행하다 보니 코드를 직접 작성할 일이 거의 없어서 기본기가 많이 부족했었네요... 면접에서 나온 질문들을 다...

2025년 12월 22일
#Career#Interview+2
Projects

[Projects] 구상

진행 중인 회사 프로젝트 21앤(21n) — 병원 시술 전자계약 플랫폼 - 역할: FullStack Developer (약 3개월차, 2026.02 ~ ) - 기술 스택: React Native(Expo), NestJS·tRPC, Next.js, PostgreS...

2025년 12월 22일
#Projects
Projects

[개인 프로젝트 리뷰] CryptoTrade.gg - 암호화폐 트레이드 전적 조회 서비스

CryptoTrade.gg 프로젝트 리뷰 - 암호화폐 트레이드 전적 조회 서비스 프로젝트 개요 프로젝트명: CryptoTrade.gg 기간: 2025.02 - 2025.04 (약 2개월) 기술 스택: TypeScript, Next.js 목적: 암호화폐...

2025년 12월 22일
#TypeScript#Next.js+3
Projects

[개인 프로젝트 리뷰] bubbleBible-FE - 모바일 우선 성경 플랫폼 개발기

bubbleBible-FE 프로젝트 리뷰 - 모바일 우선 성경 플랫폼 개발기 프로젝트 개요 프로젝트명: bubbleBible-FE 기간: 2025.08 기술 스택: React, TypeScript, Next.js, Tailwind CSS, PWA, Pus...

2025년 12월 22일
#React#TypeScript+4
Projects

[개인 프로젝트 리뷰] PEPEBear - Solana 블록체인 기반 Web3 프로젝트

PEPEBear 프로젝트 리뷰 - Solana 블록체인 기반 Web3 프로젝트 프로젝트 개요 프로젝트명: PEPEBear 기간: 2025.11 기술 스택: Next.js, TypeScript, React, Solana, Web3, Anchor Framew...

2025년 12월 22일
#Next.js#TypeScript+4
Projects

[개인 프로젝트 리뷰] love-trip - 커플 맞춤 여행 서비스 개발기

love-trip 프로젝트 리뷰 - 커플 맞춤 여행 서비스 개발기 프로젝트 개요 프로젝트명: love-trip 기간: 2025.08 기술 스택: Next.js, TypeScript, Supabase, Tour API, Naver Maps API, pnpm...

2025년 12월 22일
#Next.js#TypeScript+3
Projects

[개인 프로젝트 리뷰] ym_guide - 청년들을 위한 혜택 큐레이션 플랫폼

ymguide 프로젝트 리뷰 - 청년들을 위한 혜택 큐레이션 플랫폼 프로젝트 개요 프로젝트명: ymguide 기간: 2025.12 기술 스택: Next.js, TypeScript, Tailwind CSS, Supabase, PostgreSQL 목적: ...

2025년 12월 22일
#Next.js#TypeScript+3
Projects

[개인 프로젝트 리뷰] Toris Blog - 나만의 기술 블로그 만들기

Toris Blog 프로젝트 리뷰 - 나만의 기술 블로그 만들기 프로젝트 개요 프로젝트명: Toris Blog 기간: 2024.03 기술 스택: Next.js, TypeScript, Tailwind CSS, MDX, Vercel, GitHub Action...

2025년 12월 22일
#Next.js#TypeScript+3
Projects

[회사 프로젝트 후기] 프론트엔드 개발자로서의 성장 경험

회사 프로젝트 개발 후기 - 프론트엔드 개발자로서의 성장 경험 프로젝트 개요 회사: 셈웨어 기간: 2024.08 - 2024.12 (약 4개월) 역할: 프론트엔드 개발자 (React) 주요 기술: React, TypeScript, Spring, MyB...

2025년 12월 22일
#React#TypeScript+4
Learning

[React] React Server Components 보안 취약점 (CVE-2025-55184, CVE-2025-55183) 및 Reac2Shell 공격 벡터

🚨 React Server Components 새로운 보안 취약점 공개 2025년 12월, React 팀이 React Server Components에서 발견된 두 가지 새로운 보안 취약점을 공개했습니다. 이 취약점들은 Reac2Shell이라는 공격 벡터와 연관되...

2025년 12월 12일
#Learning
Learning

[React] React Server Components 심각한 보안 취약점 (CVE-2025-55182)

🚨 React Server Components 심각한 보안 취약점 발견 2025년 12월 3일, React 팀이 React Server Components에서 인증되지 않은 원격 코드 실행(RCE) 취약점을 공개했습니다. 이 취약점은 CVE-2025-55182로 ...

2025년 12월 3일
#React#Security+3
Career

Java Collection Framework 모음

> [!faq] java Collection Framework 란? > Java에서 데이터를 저장하는 자료구조들을 한 곳에 모아 편리하게 사용하기 위해 제공하는 List, Set, Map으로 구분할 수 있다. ![[Pasted image 20231023220222.p...

2025년 7월 14일
#Algorithm#Java
Learning

[Next.js] Next.js 15와 주요 프로젝트: 미래를 위한 도약

🚀 Next.js 15 출시: 웹 개발의 새로운 지평 2024년 10월 21일 출시된 Next.js 15는 웹 개발 경험과 애플리케이션 성능을 혁신적으로 개선하는 다양한 기능과 변경 사항을 도입했습니다. 특히 React 19 지원, Turbopack의 안정화, 그...

2025년 7월 14일
#Next.js#Next.js 15+3
Learning

[Blockchain] Next.js 기반 블록체인 애플리케이션 개발 가이드

🔗 Next.js 기반 블록체인 애플리케이션 개발 가이드 > Next.js의 강력한 프론트엔드 기능과 블록체인 기술을 결합하여 NFT 마켓플레이스, 포인트 시스템 등 다양한 Web3 애플리케이션을 구축하는 방법을 상세히 안내합니다. 📋 목차 1. [개발 ...

2025년 7월 13일
#Learning
Learning

[Blockchain] Next.js 개발자를 위한 블록체인 핵심 개념

💎 Next.js 개발자를 위한 블록체인 핵심 개념 > 블록체인 기술의 기본 원리부터 DApp(Decentralized Application) 개발에 필요한 핵심 용어까지, Next.js 개발자의 시각에서 정리합니다. 🧱 블록체인이란? 블록체인은 데이터(주...

2025년 7월 13일
#Learning
Learning

[Blockchain] Next.js와 함께하는 DeFi 서비스 개발 가이드

🏦 Next.js와 함께하는 DeFi (탈중앙화 금융) 서비스 개발 가이드 > 전통 금융을 혁신하는 블록체인 기반 금융 서비스들을 Next.js와 Solidity로 구축하는 방법을 알아봅니다. 🌟 DeFi란 무엇인가? DeFi (Decentralized F...

2025년 7월 13일
#DeFi#Blockchain+4
Learning

[React] React Portal을 이용한 효율적인 모달 관리

🚪 모달(Modal)과 z-index의 한계 모달, 툴팁, 드롭다운 메뉴 등은 종종 부모 컴포넌트의 DOM 트리 바깥에 렌더링되어야 하는 UI 요소입니다. 일반적인 컴포넌트 트리 내에서 이를 구현하려고 하면, 부모 컴포넌트의 overflow: hidden이나 z-...

2025년 7월 12일
#React#Modal+3
Learning

[React] 불필요한 DOM 요소를 피하는 방법: React.Fragment

🤔 JSX의 규칙: 단일 루트 요소 React 컴포넌트에서 여러 엘리먼트를 반환하려면, 반드시 하나의 부모(루트) 요소로 감싸야 한다는 규칙이 있습니다. 이 때문에 종종 불필요한 <div> 태그를 추가하게 됩니다. javascript // ❌ 잘못된 예: 여러 ...

2025년 7월 12일
#React#JSX+2
Learning

[React] React Testing Library 철학과 사용법

🐐 React Testing Library (RTL) 철학: 사용자처럼 테스트하라 React Testing Library (RTL)는 "테스트는 소프트웨어가 동작하는 방식과 유사해야 한다"는 핵심 원칙을 가지고 있습니다. 이는 구현의 세부 사항(예: 컴포넌트의 내...

2025년 7월 12일
#React#Testing+3
Learning

[React] React Testing Library와 Jest로 컴포넌트 테스트하기

🧪 React 컴포넌트 테스트, 왜 필요할까? 테스트 코드는 안정적인 애플리케이션을 만드는 데 필수적입니다. 특히 복잡한 상호작용이 많은 React 애플리케이션에서는, 새로운 기능 추가나 리팩토링 시에 기존 기능이 깨지지 않았는지 확인하는 회귀 테스트(Regres...

2025년 7월 12일
#React#Testing+3
Learning

[React] React와 Three.js로 인터랙티브 3D 웹 만들기

🚀 React에서 Three.js로 3D 웹 시작하기 최근 웹 트렌드 중 하나는 사용자에게 더욱 몰입감 있는 경험을 제공하는 인터랙티브 3D 웹입니다. Three.js는 WebGL을 기반으로 하는 강력한 JavaScript 3D 라이브러리로, 웹 브라우저에서 GP...

2025년 7월 11일
#React#Three.js+3
Learning

[React] React 핵심 개념 정리

⚛️ React 핵심 개념: 컴포넌트, 상태, 그리고 훅 React는 사용자 인터페이스를 구축하기 위한 선언적이고 효율적이며 유연한 JavaScript 라이브러리입니다. "컴포넌트"라고 불리는 작고 고립된 코드 조각을 사용하여 복잡한 UI를 구성할 수 있습니다. ...

2025년 7월 10일
#React#JavaScript+1
Projects

[Dev] 풀스택 개발자 워크플로우

🚀 풀스택 개발자 워크플로우 > 효율적인 프로젝트 관리와 기술 성장을 위한 개발자 워크플로우 📁 프로젝트 라이프사이클 🎯 프로젝트 기획 단계 1. 요구사항 분석 - 기능 명세서 작성 - 기술 스택 선정 - 아키텍처 설계 2. 프로젝...

2025년 7월 9일
#FullStack#Workflow+1
Projects

[Dev] 풀스택 개발자 기술 허브

🚀 풀스택 개발자 기술 허브 > 체계적인 학습과 프로젝트 관리를 위한 개발자 지식 베이스 📁 기술 영역별 구조 🎯 Projects - 프로젝트 포트폴리오 - 21앤(21n): 병원 시술 전자계약 B2B2C 플랫폼 (진행 중, 커리어) - TorisBl...

2025년 7월 9일
#FullStack#Hub+1
Projects

[Projects] 프로젝트 기획 및 아이디어 회고

📋 프로젝트 기획 및 아이디어 회고 > 다양한 프로젝트 아이디어 검토와 실제 구현으로 이어진 과정 정리 개발자로서 성장하면서 다양한 프로젝트 아이디어를 검토하고 실제로 구현해본 경험을 정리해보았습니다. 어떤 아이디어는 실제 프로젝트로 발전했고, 어떤 것은 학습의...

2025년 7월 9일
#Projects#Planning+2
Projects

[Projects] 프로젝트 개인 블로그 챗봇 Open API

생성형 AI 란? - 생성형 인공 지능(생성형 AI)은 대화, 이야기, 이미지, 동영상, 음악 등 새로운 콘텐츠와 아이디어를 만들 수 있는 AI의 일종입니다. LLM 이란? LLM(대규모 언어 모델)은 텍스트의 이해와 분석을 중심으로 하는 고급 AI 기술입니다...

2025년 7월 9일
#Projects
Personal

[Dev] 개발자 성장 및 커리어 관리

🌱 개발자 성장 및 커리어 관리 > 개발자로서의 성장과 커리어 발전을 위한 기록 공간 📁 영역별 구성 📝 개발 경험 에세이 - 프로젝트 회고록: 완성한 프로젝트에 대한 상세한 회고 - 기술 학습 후기: 새로운 기술을 배우며 겪은 경험과 인사이트 - 문...

2025년 7월 9일
#Developer#Growth+1
Learning

[Dev] 기술 학습 자료실

📚 기술 학습 자료실 > 풀스택 개발자를 위한 기술 학습 자료와 참고 문서 저장소 📁 기술 스택별 자료 구성 ⚛️ Frontend - React Ecosystem - React 핵심 개념: 컴포넌트, 상태 관리, 라이프사이클 - Next.js: SSR/...

2025년 7월 9일
#Learning#Technology+1
Learning

[Learning] CSS Grid 완전 정리

CSS Grid 완전 정리 CSS Grid는 2차원 레이아웃 시스템으로, 행(row)과 열(column)을 동시에 제어할 수 있는 강력한 레이아웃 도구입니다. Flexbox가 1차원 레이아웃에 최적화되어 있다면, Grid는 복잡한 2차원 레이아웃을 구현하는 데 최적...

2025년 7월 9일
#Learning#CSS+2
Learning

[Learning] DevOps 기본 개념과 실천 방법

🚀 DevOps 기본 개념과 실천 방법 > 개발과 운영의 경계를 허물고 효율성을 극대화하는 DevOps 문화 이해하기 DevOps는 단순한 도구나 기술이 아닌, 조직 문화와 철학의 변화를 의미합니다. 이 글에서는 DevOps의 핵심 개념과 실제 적용 방법에 대해...

2025년 7월 9일
#Learning#DevOps+2
Career

[Career] JavaScript 코딩테스트 유용 함수 정리

JavaScript 코딩테스트 유용 함수 정리 > 코딩테스트를 준비하면서 자주 사용하는 JavaScript 함수와 자료구조를 정리했습니다. 실무에서도 유용하게 사용할 수 있습니다. 📚 자료구조 1. Map - key-value 쌍을 저장하는 자료구조 Ma...

2025년 7월 9일
#Career#JavaScript+1
Career

[Career] 코테 내용

모든 알파벳을 사용하는 문자열 검사 (100/100) 문자열 sentence 를 함수의 인자로 받는데 알파벳, 공백, 특수문자로 이루어져있다. - sentence 에서 사용하지 않는 소문자 알파벳들을 return. - 완벽한 문자열은 perfect return ...

2025년 7월 9일
#Career
Career

[Career] BFS, DFS, 백트래킹 정리

DFS (Depth-first search, DFS) 그래프를 탐색하는 알고리즘의 하나로, 시작 정점으로부터 하나의 방향을 잡아 끝까지 탐색한 후 마지막 분기점으로 돌아와 다시 다른 방향으로 끝까지 탐색을 반복하는 방식. 1. 한 분기를 탐색한 후, 다음 분기로 ...

2025년 7월 9일
#Career#CodingTest
Career

[Career] 자소서

금융권 2020년 IT 정보보안에 입문하며, 다양한 보안 활동을 통해 기술의 깊이와 넓이를 탐구하였습니다. 이 과정에서 보안이 단순히 방어적인 역할만 하는 것이 아니라, 창조적인 개발 과정과 밀접하게 연결되어 있다는 것을 깨달았고, 이는 저를 개발의 세계로 이끌었습...

2025년 7월 9일
#Career
Career

[Career] 프론트엔드 정리

1. "==" 와 "===" 의 차이는 무엇인가요? -> == 는 동등 연산자로, 두 값을 비교할 때 형변환을 수행. 즉 비교하는 값의 데이터 타입이 다르더라도 자동으로 형변환을 수행한 후에 비교한다. 이러한 형변환은 때로 예측하지 못한 결과를 초래할 ...

2025년 7월 9일
#Career#Interview
Career

[Career] 내가 짜는 알고리즘 로드맵✨

알고리즘 학습 로드맵 백엔드 개발 취준을 위해 코딩 테스트를 준비하면서 체계적으로 알고리즘을 학습하기 위한 로드맵입니다. 언어 선택 백엔드 개발 취준을 하기로 선택하고 코딩 테스트를 준비하고 있기에 Java 언어에 좀 더 친숙해져야 합니다. Stream, Co...

2025년 7월 9일
#Career#Algorithm+2
Career

[Career] 누적합 알고리즘

누적합 알고리즘 > 코딩테스트에서 자주 나오는 누적합(Prefix Sum) 알고리즘을 정리합니다. 구간 합을 효율적으로 구하는 방법을 배웠습니다. 📚 누적합이란? 누적합은 구간의 합을 구하는 문제에서 사용하는 알고리즘입니다. 일반적인 방법: - 배열에 값...

2025년 7월 9일
#Career#Algorithm
Career

[Career] Java Stream 정리!!!

Java Stream 완전 정리 > Java 8에서 도입된 Stream API를 활용하여 Collection 데이터를 효율적으로 처리하는 방법을 정리합니다. 📚 Java Stream이란? Java Stream은 Java 8에서 도입된 기능으로, 선언형으로 C...

2025년 7월 9일
#Career#Java+1
Archive

[Dev] 기술 아카이브 보관소

📁 기술 아카이브 보관소 > 과거 프로젝트와 기술 자료들의 보관소 - 경험과 학습의 기록 📁 아카이브 구성 ☕ Java & Spring - 과거 Java 프로젝트들: Spring Framework 기반 웹 애플리케이션 - Spring Boot 학습 자료...

2025년 7월 9일
#Archive#Legacy+1
Archive

[Archive] NeoVim 단축키 정리

NeoVim 단축키 정리 > NeoVim을 사용하면서 자주 사용하는 단축키들을 정리했습니다. 개발 효율성을 높이기 위해 꾸준히 연습하고 있습니다. 기본 단축키 버퍼 분할 및 터미널 - <ALT + h>: 버퍼를 가로로 분할하여 터미널을 엽니다. - <ALT...

2025년 7월 9일
#Archive#NeoVim
Learning

[Web] 웹 성능 최적화 완벽 가이드

🚀 웹 성능 최적화 완벽 가이드 > 사용자 경험을 향상시키고 비즈니스 성과를 높이는 웹 성능 최적화 전략 웹 개발을 하다 보면 기능 구현에만 집중하게 되는 경우가 많습니다. 하지만 아무리 좋은 기능이라도 느린 로딩 속도 때문에 사용자가 떠나버린다면 의미가 없겠죠...

2025년 4월 24일
#Web#Performance+3
Learning

SQL 기본 개념과 실무 활용

SQL 기본 개념과 실무 활용 🗄️ 데이터베이스 기본 개념 관계형 데이터베이스(RDBMS)란? 관계형 데이터베이스는 데이터를 테이블 형태로 저장하고 관리하는 시스템입니다. 각 테이블은 행(Row)과 열(Column)로 구성되며, 테이블 간의 관계를 통해 복...

2024년 1월 15일
#SQL#Database+3
Learning

Supabase + Next.js 풀스택 개발 가이드

...

1970년 1월 1일
#Learning