프로젝트 개요활동 중인 IT 동아리 '코테이토'의 자체 웹 사이트로, 기존 프로젝트 주제는 CS 문제풀이 페이지 제작에 초점이 맞추어져 있었다. CS 퀴즈는 우리 동아리 정기 세션의 주요 콘텐츠인 CS 교육 직후에 항상 진행하곤 한다. 원래는 이걸 ppt와 카톡을 이용해서 진행했었는데 불편한 점들이 꽤 있었다. 그래서 이 불편함을 우리가 직접 해결해보자! 해서 운영진 다수와 일부 부원들이 모여 이 프로젝트를 진행하게 되었다. 8기부터 시작해서 지금까지 벌써 8개월도 넘게 진행하고 있는 만큼, 중간 회고 글을 한 번 써보려 한다. COTATO (ver.2)프로젝트 목표우선 해당 프로젝트는 앞에서 소개했던 CS 문제풀이 서비스로서의 목표는 올해 2월말 데모데이를 기점으로 달성 후 현재는 코테이토의 공식 홈페..

오이카와식 공부법우선 제목을 보고 '오...'라는 생각이 들었다면 오이카와식 공부법이 뭐일지 찾아보지 마세요.웃음이 먼저 나왔다면 그냥 모른척해주세요.재능은 타고난 것일까?보통은 타고난 능력을 재능이라고 하곤 한다.그러면 반대로 재능은 타고났으니 재능이 없는 것 같다고 느껴지면 시작점이 낮은 것일까?그럴 수 있다. 하지만 '시작점이 낮다' 혹은 '성장 속도가 느리다'는 걸로 가능과 불가능을 나눌 수 있을까? 그건 아니다. 물론 투자한 시간과 노력 대비 효율을 따진다면 가성비는 조금 떨어질 수 있다. 그렇지만 재능이 없다고 느낀다해서 그걸 핑계 삼아 합리화 시키는 행동은 좋지 않다고 생각한다.(분야에 따라서, 타고난 정도에 따라서 당연히 재능의 영향이 매우 클 수도 있다는 걸 안다. 하지만 여기서 본인이 ..

게시물 삭제 기능 구현하기4주차에 수정 기능까지 만들어보았으니 이제 삭제 기능을 구현할 차례이다.게시물 리스트에서 각 게시물마다 삭제 버튼을 만들어야 하는데, 그걸 위해 list/page.js 파일을 통째로 클라이언트 컴포넌트로 만들어버리면 효율성이 떨어지기에, 게시물 목록만 우선 따로 분리해서 클라이언트 컴포넌트로 만들어준다.컴포넌트를 분리했으면 ListItem에 DB에서 받아온 데이터를 props로 넘겨준다. 이때, props 전달하는 방법 외에 ListItem 내에서 useEffect를 사용하여 DB의 데이터를 가져오는 방법도 있다. 하지만 useEffect 안의 코드는 html 로드가 완료된 후에 실행되기 때문에 검색엔진 노출에 불리하다는 단점이 있다. 따라서 컴포넌트 구조가 너무 복잡한 경우가 ..

https://www.acmicpc.net/problem/2667 딱 봤을 때 DFS 혹은 BFS로 풀면 되는 문제인 것을 알 수 있다. 나는 시작점에서 가까운 노드부터 차례대로 그래프의 모든 노드를 탐색하는 BFS를 이용해 풀이하였다.  💡 접근 핵심시작 지점에서부터 상하좌우를 살피며 집이 있으면 방문, 동시에 집의 개수를 센다.연결된 집을 모두 세면 하나의 단지 카운팅이 끝나게 되므로, 다음 집이 있는 위치를 다시 시작점으로 하여 단지 내 집의 수를 센다. 이전에 방문한 단지의 집들은 모두 방문처리가 되어있으므로 그래프를 순회하며 다음 1이 오는 좌표부터 다시 너비우선탐색을 진행하면 된다.그래프 알고리즘의 일반적인 유형에 가까운 만큼 bfs 함수를 작성하는 것은 크게 어렵지 않았으나, 고민이 되었던..

13.4 버전 이상부터는 서버 API 기능을 page.js 안에 클라이언트 컴포넌트와 함께 작성하여 처리할 수 있게 되었다.글을 작성하는 기능을 구현한다고 할 때, 다음과 같이 코드를 작성할 수 있다.import { connectDB } from "@/utils/database";export default async function Write() { async function handleSubmit(formData) { "use server" const db = (await connectDB).db('forum') await db.collection('post_test').insertOne({title: formData.get('title')}) revalidatePath('/wr..

Middleware allows you to run code before a request is completed. Then, based on the incoming request, you can modify the response by rewriting, redirecting, modifying the request or response headers, or responding directly.ㅡ Next.js 공식문서 한마디로 미들웨어란 요청이 들어왔을 때 해당 요청에 대해 응답을 보내기 전 무언가를 수행할 수 있게 해주는 중간자같은 역할을 한다고 볼 수 있다. 애플리케이션의 성능과 보안성, 사용자 경험을 강화하고자 할 때 사용되는데, 일반적으로 다음과 같은 경우에서 효과적으로 쓰인다 :특정 페이지로..