[Nextjs] 4장 폴더 구조 이해하기

🤓 1. 폴더 구조Next.js는 React를 기반으로 한 프레임워크로, 파일 기반 라우팅, 서버 사이드 렌더링, 정적 사이트 생성 등 다양한 기능을 제공하며, 여기에 TypeScript(TSX)를 더하면 코드 안정성과 유지 보수성이 강화되어 대규모 프로젝트에 적합한 코드가 됩니다. 하지만 처음 시작할 때 어려운 부분이 바로 폴더구조이기에 이번 포스팅을 폴더 구조를 이해하는 방식에 대해 알아보겠습니다.☺️ 2. 프로젝트 폴더 구조 이해/app /page.tsx ← index 페이지 /layout.tsx ← 공통 레이아웃/components Button.tsx Header.tsx/styles globals.css Button.module.css/lib fetche..

• format_list_bulleted Front-End/NextJs
• · 2025. 9. 1.
• textsms

[C#] 14장 LINQ 기본 -> 고급쿼리

✅ 1. LinQ란?LINQ(Language Integrated Query)는 C#에 데이터 컬렉션(List,Array, Dictionary 등)이나 DB(Entity Framwork 등)에 쿼리 스타일로 접근할 수 있게 해주는 강력한 기능입니다.✅ 2. 그룹화(Grouping)그룹화(Grouping)은 특정 데이터를 특정한 키로 묶어 그룹별로 집계할 수 있게 도와주는 기능입니다. using System;using System.Collections.Generic;using System.Data;using System.Linq;public class Movies{ public string Title { get; set; } public DateTime ReleaseDate { get; set;..

• format_list_bulleted 게임 모딩/C#
• · 2025. 8. 31.
• textsms

[알고리즘] 난수란?

🤓 1. 난수란?난수(Random Number)란 말 그대로 다음에 나올 수를 예측할 수 없는 규칙이 없는 숫자처럼 보이는 값을 의미합니다, 우리가 컴퓨터애서 흔히 말하는 난수는 엄밀히 따지면 의사난수(Pseudo Random Number, PRNG)입니다. 컴퓨터는 0과 1의 논리적인 연산을 기반으로 하고 있고, 그 과정에서 무작위(Random)를 생성하기 어렵기에 특정 알고리즘(수학적 공식)을 사용해 겉보기엔 무작위 같은 수열을 만들어 내고 있습니다. 진짜 난수(True Random Number) ➡️ 자연적인 현상(방사능 붕괴, 열 잡음, 전자 신호 등)에서 추출한 무작위 값의사 난수(Pasudo Random Number) ➡️ 컴퓨터 알고리즘이 만들어내는 값, 예측은 가능해도, 특정 시드(See..

• format_list_bulleted 웹
• · 2025. 8. 31.
• textsms

[GraphQL] 5장 인자 전달과 반환값 다루기

✅ 1. 인자 전달과 반환값 GraphQL을 Node.js 환경에서 다룰 때, 가장 마주치는 개념이 바로 인자(argument) 전달과 반환값(response) 부분입니다. REST API는 URL과 Query String(쿼리 스트링), Body를 통해 데이터를 주고 받으나, GQL(GraphQL)에서는 인자와 반환값을 훨씬 직관적이고 유사하게 다룰 수 있습니다.✅ 2. 프로젝트 준비Node.js를 세팅해보겠습니다. 프로젝트 루트 폴더내에서 Apollo Server로 GraphQL을 구현한다고 가정하겠습니다.mkdir graphql-argscd graphql-argsnpm init -y npm install apollo-server graphql✅ 3. 스키마 정의하기 (Schema)이제 프로젝트 루트..

• format_list_bulleted Back-End/GraphQL
• · 2025. 8. 31.
• textsms

[Dart] 13장 추상 클래스와 인터페이스

✅ 1. 추상 클래스(abstract class)란?Dart에서 추상 클래스는 다른 클래스들이 상속받도록 설계된 불완전한 클래스로 직접 인스턴스화 할 수 없고, 상속받은 클래스에서 구현해야 하는 맴버(메서드, getter/setter)를 가질 수 있습니다.✅ 2. 추상 클래스(abstract class) 예제abstract class SuperCar { void makeSound(); // 추상 메서드, 구현 ❌ void speed() { print("🏎️ Running!"); }}class Finish extends SuperCar { @override void makeSound() { print("🚩 Finish!"); }}void main() { // SuperCar a..

• format_list_bulleted Mobile/Dart
• · 2025. 8. 30.
• textsms

[Javascript] New Javascript 8장 async/await

✅ 1. async/await자바스크립트는 단일 스래드 언어로 오래 걸리는 작업을 동기적으로 처리할 시 화면이 멈추는 현상이 발생합니다. 이를 해결하기 위해 비동기 프로그래밍을 사용해야하는 데, 그 작업 중 하나가 바로 async/await입니다.✅ 2.async/await에 관하여async/await는 각 특징을 가지고 있습니다. 먼저 async 함수는 항상 Promise를 반환한다는 특징과 await는 Promise가 끝날 때까지를 기다린 후 결과를 반환하는 역할을 담당하고 있습니다. 동기 코드처럼 직관적으로 작성이 가능합니다.// async/await 함수는 항상 Promise를 반환async function fetchData() { // await는 Promise가 처리될 따까지 대기 con..

• format_list_bulleted Front-End/JavaScript
• · 2025. 8. 30.
• textsms

[데이터 처리] 1장 데이터 처리란?

☑️ 1. 데이터 처리란? 데이터 처리(Data Processing)란 원시 데이터를 분석 가능한 형태로 변환하는 역할을 하는 과정으로 데이터를 모아두는 것만으로는 의미 있는 정보를 얻기 어렵기 때문에, 정리, 시각화, 분석 단계를 거쳐야됩니다. 일반적으로 데이터 처리 과정은 다음과 같습니다. 🚀 1. 데이터 수집(Data Collection)CSV 파일, 데이터 베이스, API, 웹 크롤링 등에서 데이터를 모으는 단계예):영화 평점, 재고 상태 데이터, 쇼핑몰 주문내역🚀 2. 데이터 전처리(Data Preprocessing) 결축지 제거, 이상치 처리, 형식 통일, 정렬 등분석에 앞서서 데이터를 정리하고 표준화하는 과정🚀 3. 데이터 분석(Data Analysis)통계 계산, 필터링, 집계, 알고..

• format_list_bulleted Database
• · 2025. 8. 30.
• textsms

[PostgreSQL] 2장 - 고급 SQL 활용하기 - 조인(JOIN)

▶️ 1. Join(조인)이란?Join(조인)은 두 개 이상의 테이블을 공통된 컬럼(Primary Key와 Foreign Key)을 기준으로 연결해 데이터를 가져오는 방식으로 SQL에서 데이터를 여러 테이블로 분리해두는 이유가 정규화(Normalization)인데, 필요할 때는 Join(조인)과 다시 합치는 작업과정을 거쳐야 합니다.▶️ 2. 예제 테이블 먼저 테이블을 하나 생성해보도록하겠습니다.-- Engineering TableCREATE TABLE computers ( universe_id SERIAL PRIMARY KEY, name VARCHAR(50), major VARCHAR(50), year INT);-- Degree TableCREATE TABLE degrees ( ..

• format_list_bulleted Database/PostGresQL
• · 2025. 8. 30.
• textsms

[PostgreSQL] 1장 - 데이터베이스와 테이블

▶️ 1. PostgreSQL 기초PosgreSQL은 안정적이고 기능이 풍부gks 오픈소스 관계형 데이터베이스 시스템(RDBMS)입니다. 다양한 웹 서버환경에 동작하고 많이 사용합니다, 이번 시간에는 PostgreSQL을 사용해 데이터 베이스와 테이블 생성, CRUD 조건 검색, 정렬, 그룹화까지를 배워보도록 하겠습니다.▶️ 2. PostgreSQL 접속 및 데이터 베이스 생성PostgreSQL은 기본적으로 psql CLI를 사용해 접속이 가능하며 터미널에 아래와 같은 명령어를 입력해줍니다.psql -U postgres-U posgtres -> 사용자 이름 지정 (보통 기본 설치 시 superuser는 postgres)접속 후 SQL 명령어 입력 가능 🚀 데이터베이스 생성-- 데이터베이스 생성CREAT..

• format_list_bulleted Database/PostGresQL
• · 2025. 8. 30.
• textsms

[Webpack] 1장 Webpack이란?

📚1. Webpack에 관하여웹 개발을 하는 과정 중에서 시간이 흘러 프로젝트 규모가 점점 커질수록 모듈 관리, 의존성 문제, 코드 최적화등의 필요성이 존재하게 됩니다. 이러한 문제들을 최종적으로 해결하기 위해 만들어진 라이브러리가 바로 Webpack(웹 팩)입니다.📚 2. Webpack 이란?Webpack은 모듈 번들러(Module Bundler)로 여러 개의 자바스크립트 파일과 그에 필요한 리소스(CSS, 이미지 등)를 하나의 파일 또는 몇 개의 파일로 묶어주는 도구로 모듈화 된 코드를 브라우저에 효율적으로 실행하도록 도와주는 라이브러리입니다. 현대 웹 개발에 필수적으로 사용되는 번들링, 코드 변환, 최적화도구입니다.📚 3. Webpack의 필요성 Webpack(웹 팩)은 단순히 HTML과 JS..

• format_list_bulleted Front-End/Webpack
• · 2025. 8. 29.
• textsms