개발 공부

개발자로 가는길 – 웹 개발을 공부하면서 기록하는 글입니다.

옵셔널 체이닝 (lodash get과 비교)

옵셔널 체이닝(Optional chaining)- (feat. lodash/get 대신에 Optional chaining을 권장하는 이유)

옵셔널 체이닝(Optional chaining) feat. lodash/get 대신에 Optional chaining을 권장하는 이유 참고: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Optional_chaining // case 1 const info = { name: ‘Alice’, cat: { name: ‘Dinah’ } } ———————————————————————— // optional chaining 1. console.log(info.dog.name) // ‘name’ of undefined 2. console.log(info?.dog.name) // ‘name’ of undefined 3. console.log(info.dog?.name) // undefined ———————————————————————— // lodash의 get 1. console.log(get(info, ‘dog.name’)) // […]

옵셔널 체이닝(Optional chaining)- (feat. lodash/get 대신에 Optional chaining을 권장하는 이유) 더 읽기"

앱스플라이어

앱스플라이어 스마트스크립트 및 관련 4가지 용어 설명

앱스플라이어 스마트스크립트 딥링크 (앱링크)를 적용한 과정입니다. 전 직장 업무 중 웹에서 앱으로 전환할 수 있도록 팝업 및 링크를 넣는 과정에서 앱스플라이어 스마트스크립트를 사용한적이 있습니다. 딥링크 (또는 앱링크)라고 불렀으며 내가 보고 있던 웹 페이지에서 앱으로 전환시 앱에서도 동일한 화면이 열릴 수 있도록 구현했습니다. 또한, 파라미터도 변환되어 마케팅적으로도 도움이 될 수 있도록 세팅한 경험을 담았습니다. 딥링크 용어

앱스플라이어 스마트스크립트 및 관련 4가지 용어 설명 더 읽기"

뒤로가기캐시

뒤로가기 캐시 BFCache, Back-Forward Cache

웹 페이지에서 뒤로가기 캐시 때문에 이슈가 있었고 해결했던 과정을 담았습니다. (BFCache, BFCache, Back-Forward Cache) 제가 겪었던 이슈를 공유하기 전 BFCache란 무엇인지 알아보겠습니다. 뒤로가기 캐시(BFCache, Back-Forward Cache) 란? 웹 브라우저의 뒤로가기 버튼을 사용할 때 이전에 방문한 페이지의 상태를 캐시해두는 기능입니다.브라우저는 해당 페이지의 상태와 DOM 트리를 저장하여 BFCache에 보관합니다. 그런 다음 사용자가 뒤로가기 버튼을 클릭하면, 이전 페이지의

뒤로가기 캐시 BFCache, Back-Forward Cache 더 읽기"

프로그래머스 완주하지 못한 선수 알고리즘 문제 풀이 과정

코딩테스트 완주하지 못한 선수

코딩테스트 – 해시 – 완주하지 못한 선수 (알고리즘) 풀어봤던 과정을 담아봤습니다. 프로그래머스 문제 코딩테스트 문제 설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항

코딩테스트 완주하지 못한 선수 더 읽기"

css의문점

css 의문점 (css 소수점, padding과 margin 선택, inline의 여백 등)

CSS를 사용하면서 몇가지 의문점이 들어서 정리해보았습니다. 1. CSS 소수점을 써도 되는걸까? 2. padding VS margin 적절하게 쓰는 법은 어떤게 있을까? 3. inline 요소들은 1px씩 여백이 생기는 이유가 뭘까? 4. 가로배치할때 inline-block, float, flex 어떤걸 써야 할까? 웹 퍼블 작업을 하다보면 CSS 작성시 많은 의문이 듭니다. 많은 의문점 중 제가 가장 크게 느꼈고 찾아본 내용에 대해

css 의문점 (css 소수점, padding과 margin 선택, inline의 여백 등) 더 읽기"

반응형이미지비율

[반응형] 이미지 리사이즈할 때 비율 유지 하는 방법

반응형 웹사이트를 제작시 화면 리사이즈 될때 이미지 비율 유지하는 방법 팁! 퍼블작업에 익숙하지 않은 프론트엔드 개발자 혹은 이제 막 웹 개발에 발을 들인 초보 개발자분들에게 반응형 웹사이트 제작시 이미지가 비율대로 줄어들게 하는 방법이 헷갈릴 수 있다고 생각합니다. 그래서 제가 퍼블리셔로서 일했을때 이미지 비율을 유지하는 코드에 대한 내용을 공유하려고 합니다. 예시 코드 마크업 예시 <ul>  <li>

[반응형] 이미지 리사이즈할 때 비율 유지 하는 방법 더 읽기"

pdfkit 사용시 속도 느림 이슈

PDFKit 사용하면서 겪었던 속도 문제 및 해결 과정

PDFKit를 사용해서 pdf 변환 작업 중 삽질한 내용에 대해 담았습니다.🥲 PDFKit 공식문서 PDFKit 사용시 발생한 문제 및 해결 과정 웹 페이지에 보여지는 내용으로 송장을 만드는 기능을 구현한 적이 있습니다. 문제 pdfkit를 통해 pdf를 만드는 작업을 하는 도중 속도가 느려지는 현상이 나타났습니다. 원인파악 및 개선시도 console로 어떤 부분에서 속도가 느려지는지 파악 => pdf로 만들 데이터를 조회하는

PDFKit 사용하면서 겪었던 속도 문제 및 해결 과정 더 읽기"

javascript-map-fill

javascript – map과 fill 각각의 어떻게 사용하는지 알아보아요.

javascript 배열을 가공하는 map과 fill에 대해서 알아보아요. javascript – map var numbers = [1, 4, 9]; var roots = numbers.map(Math.sqrt); // roots는 [1, 2, 3] // numbers는 그대로 [1, 4, 9] 배열을 가져와 새로운 배열을 만듬. (Math.sqrt는 숫자의 제곱근을 반환함.) var kvArray = [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}]; var reformattedArray = kvArray.map(function(obj){ var

javascript – map과 fill 각각의 어떻게 사용하는지 알아보아요. 더 읽기"

자료구조 개념 및 종류

자료구조의 개념과 종류

자료구조의 개념과 종류 자료구조 개념 자료구조는 데이터를 구성하고 저장하는 방법을 정의하는 것으로, 컴퓨터 과학에서 중요한 개념입니다. 자료구조는 데이터의 조직화와 관리를 위해 사용되며, 데이터의 효율적인 접근, 조작 및 조작 방법을 결정합니다. 자료구조는 데이터의 종류와 문제 해결에 필요한 연산의 종류에 따라 선택되고 설계됩니다. 자료구조는 일반적으로 선형 구조와 비선형 구조로 분류됩니다. 선형 구조는 데이터가 일렬로 나열되는 구조이고, 비선형

자료구조의 개념과 종류 더 읽기"

데이터마이닝 개념과 기법 및 활용 분야

데이터 마이닝의 개념과 기법 및 활용 분야

데이터 마이닝의 개념과 기법 및 활용 분야 데이터 마이닝의 개념 데이터 마이닝은 대규모의 데이터 집합에서 유용한 정보와 패턴을 추출하기 위한 과정입니다. 이를 통해 예측, 분류, 클러스터링, 연관 규칙 등 다양한 비즈니스 목표를 달성할 수 있습니다. 데이터 마이닝은 데이터베이스, 통계학, 기계 학습 등의 분야에서 기술과 알고리즘을 활용하여 데이터로부터 의미 있는 정보를 추출합니다. 데이터 마이닝 기법 데이터

데이터 마이닝의 개념과 기법 및 활용 분야 더 읽기"

소켓의 개념과 타입 및 통신

소켓

소켓의 개념과 타입 및 통신 소켓이란? 소켓은 클라이언트와 서버 사이의 양방향 통신을 가능하게 해주는 소프트웨어적인 구조입니다. 일반적으로, 소켓은 IP 주소와 포트 번호를 사용하여 특정 네트워크 서비스에 접속하고 통신할 수 있는 엔드포인트를 나타냅니다. 소켓에는 클라이언트 소켓과 서버 보켓이 있는데 양측 간 데이터의 송수신이 가능해집니다. 클라이언트 소켓이란? 클라이언트 소켓은 네트워크 서비스에 접속하여 요청을 보내는 역할을 합니다. 예를

소켓 더 읽기"

분산 컴퓨팅 개념과 기술 및 알고리즘

분산 컴퓨팅

분산 컴퓨팅 개념과 기술 및 알고리즘 분산 컴퓨팅 개념 분산 컴퓨팅은 여러 컴퓨터 또는 컴퓨팅 장치가 네트워크로 연결되어 작업을 협력적으로 수행하는 컴퓨팅 환경을 의미합니다. 기존의 중앙집중식 컴퓨팅과는 달리, 분산 컴퓨팅은 작업을 여러 개의 컴퓨터에 분산시켜 처리하고, 그 결과를 통합하여 도출합니다. 분산 컴퓨팅은 처리 속도를 높이고 병렬성을 활용하여 복잡한 문제를 해결하는 데 유용합니다. 분산 컴퓨팅 기술

분산 컴퓨팅 더 읽기"

위로 스크롤