DEV_JACKY

인기글

• 

  [FE] 자바스크립트 비동기 개념 정리 하기 들어가며스터디에서 동기, 비동기 개념을 다루는 김에 전에 작성해둔 글들과 여러 참고 자료들을 보면서 자바스크립에서의 비동기 개념에 대해서 정리해보는 시간을 가져 봤습니다. 조금 더 추가해야 되는 내용들이 많지만 작성해두고 개선을 해나가보려고 합니다. 자바스크립트에 동기, 비동기 개념이 있는 이유자바스크립트는 싱글 스레드 언어이기 때문에 한번에 하나의 작업만 수행 할 수 있다. 즉 이전 작업이 완료 되어야 다음 작업을 수행 할 수 있게 된다.우리가 프로그래밍을 하면서 일반적으로 위에서 아래로 차례대로 실행 되는 방식, 이러한 코드 순차 실행을 동기라고 부른다.동기 방식은 직관적이지만 다수의 작업이 이루어진다면, 특정 작업이 마무리 될 때 까지 다음 작업이 이루어 질 수 없기 때문에 성능과 사용자 경험에 영.. 댓글 0 2025.01.30

• 

  [ICT 인턴십] 지원부터 인턴까지 - 지원하기 인턴십 신청부터 인턴을 했던 과정까지2024.03.~2024.06. 까지 관악구 있는 L사 에서 프론트엔드 개발 인턴으로 ICT 학점 연계 인턴십을 통해서 4개월 간 인턴으로 근무를 하게 되었던 과정에 대해서 인턴이 끝나고 정리해보려고 합니다. 인턴십을 알고는 있었지만 제가 학교가 경북대다 보니 이쪽에는 해당 프로그램을 많이 했던 사람이 없어 정보가 부족했던 와중에 추천을 받아서 지원을 하고 인턴을 했던 과정을 정리하려 합니다. "ICT 인턴십 꼭 해요" (캠프원들이 인턴십 프로그램을 추천 하면서)올해 초 스마일게이트에서 진행했던 개발캠프에 참가하면서 캠프원들과 다양한 정보를 공유할 수 있는 기회가 있었습니다 덕분에 다양한 정보를 얻을 수 있었는데, 그 중에 가장 캠프원들이 추천을 해주었던 게 바로 IC.. 댓글 0 2024.07.09

• 

  [백준] 18511, 1260, 2606 / DFS, BFS 정리 / JavaScript DFS와 BFS의 실전적 이해: 백준 문제 풀이를 통한 완전 탐색 전략들어가며백준 문제를 풀면서 Greedy, DP 문제를 풀다가 드디어 항상 어려워했던 DFS, BFS 문제로 넘어오게 되었습니다. 완전 탐색 문제들을 풀면서 상황에 따라 DFS, BFS를 사용해야 할 필요를 느꼈고, 항상 개념만 알고 코드로 풀어내는 경험이 부족했던 것 같아서 정리하면서 글로 작성해보려고 합니다.DFS와 BFS의 기본 개념간단하게 이해하자면:DFS(깊이 우선 탐색): 경우의 수를 구할 때 그래프를 그린다면 나올 수 있는 가장 깊은 곳까지 갔다가 돌아오는 느낌BFS(너비 우선 탐색): 경우의 수를 구할 때 그래프를 그린다면 한 층씩 마무리해가면서 다음 단계로 넘어가는 느낌코드로 보는 실제 구현실제 구현에서 DFS와 BFS는.. 댓글 0 2025.01.25

최신글

• 

  [FE] HTTP 상태 코드가 뭘까요? HTTP란?HTTP(Hypertext Transfer Protocol)는 웹 서버와 웹 클라이언트 사이에서 데이터를 주고받기 위해 사용하는 통신 방식으로 TCP/IP 프로토콜 위에서 동작합니다. 즉, 우리가 웹을 이용하려면 웹 서버와 웹 클라이언트는 각각 TCP/IP 동작에 필수적인 IP 주소를 가져야 합니다.HTTP란 이름대로라면 하이퍼텍스트(Hypertext)만 전송할 수 있어 보이지만, 실제로는 HTML이나 XML과 같은 하이퍼텍스트뿐 아니라 이미지, 음성, 동영상, Javascript, PDF와 각종 문서 파일 등 컴퓨터에서 다룰 수 있는 데이터라면 무엇이든 전송할 수 있습니다.HTTP 상태 코드란?이러한 HTTP 통신 과정에서, 웹 서버는 클라이언트의 요청에 대한 처리 결과를 상태 코드를 통해 .. 2025.02.01

• 

  [FE] 자바스크립트 비동기 개념 정리 하기 들어가며스터디에서 동기, 비동기 개념을 다루는 김에 전에 작성해둔 글들과 여러 참고 자료들을 보면서 자바스크립에서의 비동기 개념에 대해서 정리해보는 시간을 가져 봤습니다. 조금 더 추가해야 되는 내용들이 많지만 작성해두고 개선을 해나가보려고 합니다. 자바스크립트에 동기, 비동기 개념이 있는 이유자바스크립트는 싱글 스레드 언어이기 때문에 한번에 하나의 작업만 수행 할 수 있다. 즉 이전 작업이 완료 되어야 다음 작업을 수행 할 수 있게 된다.우리가 프로그래밍을 하면서 일반적으로 위에서 아래로 차례대로 실행 되는 방식, 이러한 코드 순차 실행을 동기라고 부른다.동기 방식은 직관적이지만 다수의 작업이 이루어진다면, 특정 작업이 마무리 될 때 까지 다음 작업이 이루어 질 수 없기 때문에 성능과 사용자 경험에 영.. 2025.01.30

• 

  [백준] 13023 - 백트래킹 적용하기 들어가며안녕하세요, 오늘은 DFS(깊이 우선 탐색)와 백트래킹을 활용하여 친구 관계 탐색 문제를 해결하는 과정을 단계별로 살펴보겠습니다. dfs, bfs 문제를 풀고 백트래킹 문제를 풀려고 했는데 이렇게 바로 풀게 되었습니다.🤔 Before: 처음 마주친 문제 상황문제는 다음과 같습니다:N명의 사람들 사이의 친구 관계가 주어집니다.한 사람에서 시작하여 친구 관계를 4번 이상 거쳐갈 수 있는지 확인해야 합니다.가능한 경로가 존재하면 1, 없으면 0을 출력합니다.처음에는 단순히 DFS를 구현하면 될 것이라 생각했지만, 여러 문제점들에 직면했습니다:한 시작점에서만 탐색을 시작하여 모든 가능한 경로를 찾지 못했습니다.메모리를 많이 사용하는 인접 행렬 방식을 사용했습니다.이전 경로로 돌아가서 다른 경로를 탐색하.. 2025.01.27

• 

  [백준] 18511, 1260, 2606 / DFS, BFS 정리 / JavaScript DFS와 BFS의 실전적 이해: 백준 문제 풀이를 통한 완전 탐색 전략들어가며백준 문제를 풀면서 Greedy, DP 문제를 풀다가 드디어 항상 어려워했던 DFS, BFS 문제로 넘어오게 되었습니다. 완전 탐색 문제들을 풀면서 상황에 따라 DFS, BFS를 사용해야 할 필요를 느꼈고, 항상 개념만 알고 코드로 풀어내는 경험이 부족했던 것 같아서 정리하면서 글로 작성해보려고 합니다.DFS와 BFS의 기본 개념간단하게 이해하자면:DFS(깊이 우선 탐색): 경우의 수를 구할 때 그래프를 그린다면 나올 수 있는 가장 깊은 곳까지 갔다가 돌아오는 느낌BFS(너비 우선 탐색): 경우의 수를 구할 때 그래프를 그린다면 한 층씩 마무리해가면서 다음 단계로 넘어가는 느낌코드로 보는 실제 구현실제 구현에서 DFS와 BFS는.. 2025.01.25

• 

  [백준] 1912 - dp const fs = require('fs');const filePath = process.platform === 'linux' ? 'dev/stdin' : '../input.txt';const input = fs.readFileSync(filePath).toString().trim().split('\n');let N = parseInt(input[0]);//N만큼 배열에 담아주기let dp = new Array(N).fill(0);//N만큼 값 담아오기let list = input[1].split(' ').map((item) => parseInt(item));//dp[0]은 list[0]으로 초기화dp[0] = list[0];//dp[i]는 dp[i-1]과 list[i]를 비교해서 큰 값을 넣어준다.fo.. 2025.01.22

• 

  [백준] 2748, 10870 - 피보나치 문제 풀기 2748번 const fs = require('fs');const filePath = process.platform === 'linux' ? 'dev/stdin' : '../input.txt';const input = fs.readFileSync(filePath).toString().trim().split('\n');let N = parseInt(input[0]);let list = [0, 1, 1];for (let i = 3; i 10870번const fs = require('fs');const filePath = process.platform === 'linux' ? 'dev/stdin' : '../input.txt';const input = fs.readFileSync(filePath).toStri.. 2025.01.20

• 

  [백준] 13305 - BigInt 사용하기 const fs = require('fs');const filePath = process.platform === 'linux' ? 'dev/stdin' : '../input.txt';const input = fs.readFileSync(filePath).toString().trim().split('\n');//도시 마다 가야 되는 거리가 적혀있고//도시마다 기름값이 적혀있음//처음에는 첫 도시에서 기름을 넣어주고 다음 도시로 이동//다음 도시로 이동할 때 기름값이 더 싸면 그 도시에서 기름을 넣어주고 다음 도시로 이동//기름값이 더 비싸면 다음 도시로 이동//도착지로 이동할 때 필요한 최소비용을 구하라let N = parseInt(input[0]);let distance = input[1].split('.. 2025.01.15

• 

  [자바스크립트 코테 준비] Map 정리하기 1. Map이란?Map은 키(key)와 값(value)을 쌍으로 저장하는 데이터 구조입니다.일상생활 속 Map의 예시사물함: 사물함 번호(키)와 그 안의 물건(값)전화번호부: 이름(키)과 전화번호(값)학생 명부: 학번(키)과 학생 정보(값)Object와 Map의 차이키의 유연성Object: 문자열과 Symbol만 키로 사용 가능Map: 모든 값(함수, 객체, 숫자 등)을 키로 사용 가능순서 보장Object: 키의 순서가 보장되지 않음Map: 삽입한 순서대로 보장됨크기 확인Object: 크기를 직접 계산해야 함Map: size 속성으로 쉽게 확인 가능2. Map 기본 사용법생성// 빈 Map 생성const map = new Map();// 초기값과 함께 생성const mapWithInit = new Map.. 2025.01.04

• [네이버 부스트캠프] 우리는 Vite, StoryBook, Tsdoc을 왜 사용할까? 들어가며부스트캠프 그룹 프로젝트를 시작한 지 2주차가 지나가고 있습니다. 이번 기수는 특별히 주제를 기준으로 랜덤으로 팀이 구성되었습니다. 네이버 부스트캠프에서 추구하는 방향성이 웹 풀스택 개발자 양성이지만, 각자의 선호도와 희망 진로는 다를 수 있다는 점을 고려하며 프로젝트를 진행하고 있습니다. 이러한 상황에서 저는 팀의 유일한 프론트엔드 지망생으로 참여하게 되었습니다.프로젝트를 준비하고 진행하면서 '어떤 방향으로 나아가야 더 큰 성장을 이룰 수 있을까'라는 고민을 계속했습니다. 단순한 기술적 도전을 넘어서, 다양한 측면에서의 성장을 고려하다 보니 기술 스택과 도구 선정에 특별히 많은 시간을 투자했습니다.이번 프로젝트의 기술 스택과 개발 방향을 결정하는 데 있어 두 가지 상황을 중점적으로 고려했습니다... 2024.11.18