꿈많은 DEVELOPER

🤷‍♂️ 본론에 앞서 중요한 배열 사전 지식 공부하기 "> HTML 삽입미리보기할 수 없는 소스배열 reduce() 함수 사용법에 대해 알아보기https://cometruedream.tistory.com/256 [자바스크립트] 배열(array) reduce 함수의 개념및 활용도 높은 사용법🤷‍♂️ 본론에 앞서 중요한 배열 사전 지식 공부하기 배열 join() 함수 사용법에 대해 알아보기https://cometruedream.tistory.com/254 [자바스크립트] 배열(array)을 유용하게 활용할 수 있는 join 함수 개cometruedream.tistory.com  배열 join() 함수 사용법에 대해 알아보기https://cometruedream.tistory.com/254 [자바스크립트]..

🤷‍♂️ 본론에 앞서 중요한 배열 사전 지식 공부하기 배열 join() 함수 사용법에 대해 알아보기https://cometruedream.tistory.com/254 [자바스크립트] 배열(array)을 유용하게 활용할 수 있는 join 함수 개념 및 사용법🤷‍♂️ 본론에 앞서배열은 javascript에서 가장 중요한 데이터 자료구조 중 하나입니다.배열에 내장함수를 활용하는 것은 javascript에서 중요한 부분 중 하나이며 join() 배열 메서드는 배열을 합cometruedream.tistory.com  배열 map(), forEach() 인기있는 메서드 사용법에 대해 알아보기https://cometruedream.tistory.com/253 [자바스크립트] 배열(array)을 처리하는 인기있는 ..

🤷‍♂️ 본론에 앞서배열은 javascript에서 가장 중요한 데이터 자료구조 중 하나입니다.배열에 내장함수를 활용하는 것은 javascript에서 중요한 부분 중 하나이며 join() 배열 메서드는 배열을 합치는 것에 가장 중요한 내장함수 중 하나입니다.join() 배열 메서드를 더 잘 활용할 수 있도록 알아보겠습니다. 배열(array)을 처리하는 인기 있는 메서드 map(), forEach() 개념과 차이점https://cometruedream.tistory.com/253 [자바스크립트] 배열(array)을 처리하는 인기있는 메소드 map(), forEach() 개념과 차이점🤷‍♂️ 본론에 앞서자바스크립트는 현재 웹/앱 개발 트렌드에서 필수적으로 사용되는 프로그래밍 언어입니다. 여러 아이템을 저장..

🤷‍♂️ 본론에 앞서자바스크립트는 현재 웹/앱 개발 트렌드에서 필수적으로 사용되는 프로그래밍 언어입니다. 여러 아이템을 저장하는데 사용되는 배열과 이를 파싱하며 새로운 데이터를 생성하고 조작하는데 필요한 자바스크립트 내장함수인 map(), forEach()라는 두 가지 인기 있는 배열 메소드에 대해 알고 계실 겁니다. 이 두 배열 메소드는 배열에 루프를 처리하는 기능이 비슷하지만 중요한 차이점이 있습니다. 이 차이점을 공부하여 배열 메소드를 더 효율적으로 활용할 수 있도록 알아보겠습니다.  " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 🤷‍♂️ 배열(array)이란?배열은 여러 개의 아이템을 순서대로 저장, 추가, 삭제할 수 있는 자료구조입니다. 배열은 각 요소에 인덱스..

🤷‍♂️ 본론에 앞서react-query는 React에서 데이터를 가져오고, 캐싱하고, 동기화하고, 데이터 관리를 위한 후크와 유틸리티를 제공하는 라이브러리입니다. 이 라이브러리의 활용은 React의 전반적인 성능을 향상시키고 사용자에게 부드러운 경험을 줄 수 있습니다. react-query 사용법에 대해 알아보기https://cometruedream.tistory.com/130 React-query 상태 관리📖React-query 알기전에 JSX란?JSX(javascript XML)는 javascript에 XML을 추가한 확장한 문법이다.JSX는 React에서 사용되는데 공식적인 자바스크립트 문법은 아니다.JSX는 javascript 확장한 문법으로 바벨등등을cometruedream.tistory...

🤷‍♂️ 본론에 앞서풀스택 개발을 진행하면서 사용자의 입장을 우선으로 하여 사용자 경험을 최우선으로 개발하려 노력합니다. 얼마 전에 읽은 책에서"개발하는 사람이 수고롭다면 사용하는 사람이 편리하고, 개발하는 사람이 편리하다면 사용하는 사람이 수고롭다" 라는 말을 되새겨 봅니다! Prefetching이란 무엇인가?프리페칭은 데이터가 실제로 필요하기 전에 미리 데이터를 가져와 캐시에 저장하는 과정을 말합니다. 이러한 프리페칭 기술을 통해 데이터를 미리 캐싱하면 사용자 경험을 향상할 수 있습니다. 간단히 설명하면💡 미리 필요할 수 있는 데이터를 가져오는 것을 의미합니다. 대표적으로 페이지네이션과 특정 탭을 누를 확률이 높은 곳에서 프리페칭을 많이 사용합니다.화면이 부드럽게 이동하고 캐싱데이터에 액세스 해서..

🤷‍♂️ 자바스크립트 내장 함수란?자바스크립트를 효율적으로 활용하려면 내장 함수를 잘 사용해야 합니다.내장 함수는 자바스크립트에서 미리 선언된 함수로, 호출만으로 사용할 수 있습니다.자바스크립트 언어를 사용한다면 기본적으로 제공하는 함수들을 활용해서 다양한 작업을 쉽고 효율적인 코드로 사용할 수있게 도와줍니다. javascript map() 함수 알아보자!https://cometruedream.tistory.com/7 javascript map() 함수 알아보자값이 여러개 있는 배열에서 모든 값을 꺼내는 방식은 다양하게 알려져 있습니다 대표적으로 for문,,,하지만 오늘은 map() 함수를 다뤄보도록 하겠습니다  vs코드를 여시고 let getStartedarr 배열에cometruedream.tisto..

🤷‍♂️ Redis 개념?Redis(Remote Dictionary Server)는 키(key)와 값(value)의 구조를 가진 비관계형 데이터베이스인 NoSql입니다. 오픈 소스 기반의 in-memory 데이터 저장소를 사용하는 Redis는 일반적인 데이터베이스와 달리, 데이터를 주 메모리(RAM)에 저장합니다. 이 특징은 데이터에 빠르게 접근 가능하게 하며, Redis의 성능을 향상시키고 응답 시간을 최소화하여 사용자에게 빠른 데이터 제공을 가능하게 합니다. 간단히 이해하기 위한 팁!일반 데이터베이스는 데이터를 보조 기억장치에 저장하므로, 저장된 데이터에 접근할 때마다 디스크를 직접 접근해야 합니다. 이로 인해 읽기 속도 & 응답 시간이 필요합니다. 반면, in-memory 데이터베이스인 Redis..

🤷‍♂️ 본론에 앞서프로젝트 개발을 하다 보면 로컬에서 개발 중인 버전을 배포하지 않고 외부에서 접근할 수 있도록 서버를 구축해야 할 일이 있습니다.예를 들어 외부 협력업체, 거래처에서 개발 중인 버전을 확인하고 싶을 때나 외부에서 테스트를 위해서 외부에서 로컬에 접근을 위한 서버를 만들어야 됩니다. 외부에 접근을 위해서 다양한 방법들이 존재합니다. 공유기 설정에서 포트포워딩 방식, 외부에서 접근할 수 있도록 서버를 구축하는 방법 등등... 언급한 2가지 방법은 상당히 까다롭고 시간이 필요한 작업입니다.위에 두가지 방법 없이 외부에서 로컬을 접속 가능하게 하는 터널 프로그램 ngrok에 대해서 알아보겠습니다.   🤷‍♂️ ngrok란?ngrok은 외부에서 로컬에 접속할 수 있도록 도와주는 터널링 프로..

🤷‍♂️ Tailwind 한줄, 두줄, 세줄 효과프로젝트 진행중 배너 링크에 URL 길이가 너무 길어서 3줄 효과 처리를 해야 했습니다. React + Tailwind CSS 셋팅된 프로젝트 여서 CSS 파일 & style 태그를 사용하지 않고 className 속성을 활용해서 CSS 스타일링 해야 했습니다.   기존에 방식으로 한줄 효과 스타일링을 하려고 했으나 tailwind CSS 방식이 달라서 다른 좋은 방법을 찾았습니다. 한줄 효과 기존 CSS 방식p { width: 6rem; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clam..