jin's Blog

JS + React = Web DevelopmentJS + Three.js = 3D VisualizationJS + Angular = Web ApplicationsJS + Phaser = Game DevelopmentJS + Vue.js = Progressive Web AppsJS + TensorFlow.js = Machine LearningJS + Node.js = Server-Side DevelopmentJS + Electron = Desktop App DevelopmentJS + React Native = Mobile App DevelopmentJS + D3.js = Data Manipulation and VisualizationJS + Next.js = Server-Side Rendering & ..

프론트엔드 작업에서 자주 사용하는 기능과 도구를 전체적인 과정과 함께 순서대로 정리해보겠습니다. 이 순서는 대부분의 프론트엔드 개발자들이 작업할 때 겪는 일반적인 워크플로우를 반영하며, 사용하는 도구와 프레임워크는 현재(2025년 기준) 가장 인기 있는 기술을 기준으로 작성했다. GPT로 부터 정보를 얻음, 1. 프로젝트 초기 설정주요 작업:프로젝트 구조 설정 및 기본 환경 구성.패키지 매니저로 필요한 라이브러리 설치.개발 환경(로컬 서버, 빌드 도구) 설정.자주 사용하는 도구:패키지 매니저:npm, yarn, 또는 pnpm (최근 pnpm의 인기가 증가)프로젝트 초기화:create-react-app, Vite, Next.js, Create Next AppVite가 속도와 단순성 덕분에 최근 인기.버전 ..

프론트엔드 개발에서 사용하는 상태 관리 및 HTTP 요청 라이브러리들최근 프론트엔드 개발자들은 애플리케이션의 상태 관리와 HTTP 요청을 효과적으로 처리하기 위해 다양한 라이브러리를 사용하고 있다. 이번 글에서는 가장 자주 사용되는 라이브러리들의 특징과 장단점을 간단히 정리하고, 최종적으로 어떤 상황에서 무엇을 추천하는지 이야기해보겠다.1. React Context APIReact Context API는 React에서 기본으로 제공하는 상태 관리 도구로, 전역 상태를 쉽게 관리할 수 있도록 도와준다.장점:내장 기능으로 별도의 설치가 필요 없다.간단한 상태 관리에서 효율적이다.단점:상태가 복잡하거나 업데이트가 잦은 경우 성능 저하가 발생한다.비동기 작업을 처리하려면 추가 설정이 필요하다.React Cont..

데이터 구조와 타입 상세 예시데이터 구조와 타입의 각 예시를 실제 데이터 형태와 함께 보여주고, 그에 해당하는 영어 표현을 추가로 정리해 보았다.제발 그만 까먹자..1. 객체 (Object)영어: Object형태: { key: value }설명: 키-값 쌍으로 이루어진 데이터 구조. 데이터를 명확히 정의하고 다룰 수 있다.예시:{ "name": "Jin", "age": 25, "isDeveloper": true} 2. 배열 (Array)영어: Array형태: [value1, value2, ...]설명: 순서가 있는 데이터의 리스트. 데이터에 접근할 때 인덱스(번호)를 사용한다.예시:["apple", "banana", "cherry"] 3. 리스트 (List)영어: List형태: (일반적으로 배열 형..

리액트를 공부하다 우연히 자동화 시스템 구축하는(Make)와 노코드로 웹/앱을 구축하는 Bubble이라는 사이트를 보고프론트앤드 개발자가 되는 것에 대한 막연한 불안감이 들기 시작했다. 리액트 공부를 멈추고 멍하니 두 가지 프로그램을 알려주는 강의 영상을 1시간 35분 동안 봤다.전부 다 본 후에도 이게 맞는지, 코드를 치지 않고 ai와 자동화된 시스템으로 사이트를 구축하는 방법이 맞는 건지 계속해서 의문이 들었고내가 하는 모든 과정들이 무의미하게 느껴졌다. 앞으로 ai가 더욱 발전될 텐데 지금 내가 하는 이 원초적이고 정통적인 방법이 맞는 건지혼란스러운 생각을 하는 과정을 겪었다. 약 2시간 정도를 소비하고 나서 다시 원점을 돌아왔다. 지금으로서는 저 두 가지 자동화 웹사이트에도 한계가 있고세부적인 웹..

기본 IT 영어 단어 시드니에서 살아남으려면 기본적인 개발 영어는 알아두자... 프로그래밍 언어 관련 단어 개발 방법론 및 SDLC (Software Development Life Cycle) 관련 단어 네트워크 및 보안 관련 단어 알고리즘 및 자료 구조 관련 단어 DB 관련 단어