TIL 썸네일형 리스트형 글또 10기를 지원하며 - 삶의지도 작성 삶의 지도글또를 지원하면서 그동안의 삶을 되돌아보며 삶의 지도를 작성해보겠습니다. 개발자를 향한 도전컴퓨터 관련 직업에 대해 처음 생각해본 것은 개발 직군에서 일하는 분과의 대화를 통해서였습니다. 이후 미국 여행 중 실리콘밸리를 방문했을 때, 높은 건물들과 바삐 움직이는 사람들의 열정 속에서 저의 비전과 꿈을 현실화해보자는 생각이 들어 가슴이 뛰었습니다. 그 후 유튜브에서 코딩 강의를 접하고 점차 개발에 대한 흥미가 생기기 시작했습니다. 간접적으로 프론트엔드 수업을 경험하며 더 깊이 있는 성장을 이루기 위해 개발 지식이 필요하다는 결심이 확고해졌습니다. 그래서 본격적으로 개발자가 되기로 결심하고 스파르타 99 개발 부트캠프에 지원했습니다. 이곳에서 저는 99일 동안 하루도 빠짐없이 자바스크립트와 리액트를.. 더보기 [HTTP response status codes] Successful responses 이번에 다뤄 볼 부분은 Successful responses입니다.성공적인 요청에 대해 반환되는 상태 코드들은 클라이언트가 요청한 작업이 올바르게 처리되었음을 나타냅니다. 200 OK: 요청이 성공적으로 처리되었습니다. HTTP 메서드에 따라 성공의 의미가 다릅니다:GET: 리소스가 메시지 본문에 포함되어 전송됩니다.HEAD: 응답에 리소스의 헤더만 포함됩니다.PUT 또는 POST: 액션의 결과를 설명하는 리소스가 메시지 본문에 포함됩니다.TRACE: 메시지 본문에 서버가 수신한 요청 메시지가 포함됩니다.201 Created: 요청이 성공적으로 처리되었으며, 새로운 리소스가 생성되었습니다. 일반적으로 POST 요청 후나 일부 PUT 요청 후에 반환됩니다.202 Accepted: 요청이 수신되었지만 아직 .. 더보기 [HTTP response status codes] Client error responses 이번에 다뤄 볼 부분은 Client error responses입니다.이 상태 코드들은 주로 프론트엔드에서 확인해야 하는 에러 코드들입니다. 하지만, 프론트엔드 측에서만 에러를 확인해서는 안 됩니다. 서버 측에서도 적절한 에러 처리가 필요하며, 클라이언트와 서버 간의 협력이 중요합니다. 400 Bad Request: 클라이언트의 잘못된 요청(잘못된 구문, 유효하지 않은 요청 메시지 등)으로 인해 서버가 요청을 처리할 수 없습니다.401 Unauthorized: 클라이언트가 인증되지 않았습니다. 클라이언트는 요청한 응답을 받기 위해 인증을 해야 합니다.402 Payment Required (실험적): 디지털 결제 시스템을 위해 예약된 코드이며, 거의 사용되지 않으며 표준적인 사용 방식이 없습니다.403 F.. 더보기 [HTTP response status codes] Server error responses Next.js에서 백엔드 코드를 짜던 중 status codes에 대해 자세히 알아보고 싶어서 정리하는 글입니다. 제일 먼저 다뤄 볼 부분은 서버 오류 응답 코드입니다. 이 코드를 통해 발생한 에러를 로깅하고, 클라이언트에게 적절한 500 오류 메시지를 반환했습니다. 500 Internal Server Error: 서버에서 예기치 못한 상황이 발생하여 요청을 처리할 수 없습니다.501 Not Implemented: 서버가 요청된 메서드를 지원하지 않습니다. 서버가 반드시 지원해야 하는 메서드는 GET과 HEAD입니다.502 Bad Gateway: 서버가 게이트웨이 역할을 하면서, 잘못된 응답을 받아 요청을 처리할 수 없습니다.503 Service Unavailable: 서버가 요청을 처리할 준비가 되어 .. 더보기 [자바스크립트의 패키지 관리 도구] npm과 yarn npm 사용 시기본 Node.js 설치: npm은 Node.js와 함께 기본적으로 설치됩니다. 별도의 설치가 필요 없으므로 빠르게 시작할 수 있습니다.커뮤니티와 호환성: npm은 가장 큰 패키지 레지스트리를 가지고 있으며, 대부분의 패키지가 npm을 기준으로 개발됩니다. 따라서, 널리 사용되는 패키지와 호환성이 좋습니다.단순함: 기본적인 패키지 관리와 스크립트 실행 기능이 충분하다면 npm으로도 충분히 관리할 수 있습니다.성능 개선: 최근 npm의 성능도 많이 개선되었습니다. 최신 버전은 많은 속도 최적화와 기능 향상이 이루어졌습니다.Yarn 사용 시속도와 성능: Yarn은 초기에는 병렬 다운로드와 캐싱으로 속도 면에서 강점을 보였습니다. 최근에는 npm도 성능이 많이 개선되었지만, 여전히 빠른 성능을 .. 더보기 [React-Query] useInfiniteQuery로 무한스크롤 구현하기 이번 프로젝트를 진행하면서 무한스크롤을 구현해봤습니다.타 회사에서 무한스크롤 구현하는 포스팅을 보고 참고해서 비교해 보면서 코드 리팩토링을 할 부분에 대해 작성해보겠습니다. NoticeTable.tsx"use client";import { DataTable } from "@/components/common/table/table";import { columns } from "./notice-columns";import { Row, getCoreRowModel, useReactTable } from "@tanstack/react-table";import { useRouter } from "next/navigation";import { useGetNoticeQuery } from "../queries/get-.. 더보기 Tailwind CSS, CSS-in-JS, Styled Components 비교: 왜 Tailwind를 선택했는지? 이번 프로젝트를 진행하면서 Tailwind CSS를 사용했습니다. 이를 선택한 이유와 다른 스타일 라이브러리와의 비교를 통해 설명드리겠습니다.1. 스타일링 접근 방식Tailwind CSS: 유틸리티 클래스 기반의 프레임워크로, 미리 정의된 클래스들을 HTML 요소에 적용하여 스타일링합니다. CSS 파일을 작성할 필요 없이, 필요한 스타일을 HTML에서 바로 적용할 수 있습니다.CSS-in-JS: 스타일을 자바스크립트 파일 내에서 직접 작성하고 관리할 수 있게 해주는 접근 방식입니다. 대표적으로 Emotion, Styled Components 등이 있으며, 스타일을 컴포넌트 내부에 작성해 스타일링과 자바스크립트를 결합할 수 있습니다.Styled Components: CSS-in-JS의 한 종류로, 컴포넌트.. 더보기 .gitignore가 작동하지 않을때 .gitignore가 제대로 작동되지 않아서 ignore처리된 파일이 자꾸 changes에 나올때가 있는데git의 캐시가 문제가 되는거라 아래 명령어로 캐시 내용을 전부 삭제후 다시 add All해서 커밋하면 된다!git rm -r --cached .git add .git commit -m "fixed untracked files" 더보기 이전 1 2 3 4 5 다음
