https://oimnee.tistory.com/

노션이 템플릿도 잘돼있고 잘 사용하면 좋은데 잘 사용하기가 어려운 거 같다기획자가 만든 노션 페이지를 보면 "우와"스러운데 개인적인 페이지를 그렇게 만들려면 꽤 손이 많이 가고 어렵게 느껴져서 "에잇!" 하고 그냥 때려치운 적이 있다. 좋은거 나도 잘 써보고 싶은데 맘

가상 DOM이 어떻게 동작하는지 이해하려고 노력하고 있었어요. 높은 수준에서는 이해가 됐지만, 더 자세한 설명이 필요했어요.여러 검색을 해봤지만 원하는 정보를 찾지 못해, 결국 react와 react-dom의 코드를 직접 살펴보기로 했어요. 이렇게 하면 어떻게 동작하는

Creating the basic URL structureWriting the basic inline HTMLCommunicating between JavaScript and NativeThe injectJavaScript methodConclusionWebViews는

팀플하면서 발생한 이슈를 기록해보자!우선 코드를 보자보기만 해도 예상이 간다.실 상황에서는 이것보다 좀 더 고민을 해야했다. IntersectionObserver() 로직이기 때문이다.entry.isIntersecting은 타겟이 뷰포트와 교차됐는지를 알려준다. 교차가

TestType\['user']\['name']'{ name?: string | null | undefined; email?: string | null | undefined; login: string; id: number; node_id: string; avatar_u

React-Query 관련 블로그 Customize staleTime(https://tkdodo.eu/blog/react-query-as-a-state-managerReact-Query 관리 개발자 Dominik은 staleTime을 이렇게 설명합니다.쿼리가

한 보따리를 챙기기 위해서!기업부스를 열심히 다녀야했는데 오후에는 줄이 더 길거같아서 듣고싶은 강연 주제가 애매했던 오전 타임에 다 돌았어요

GraphQL 및 특히 Apollo Client가 2018년경에 인기를 얻으면서 Redux를 완전히 대체할 것이라는 많은 소란이 있었고 "Redux는 이미 죽었나요?"라는 질문이 자주 던져졌습니다.나는 명확하게 그게 무슨 뜻인지 이해하지 못했습니다. 왜 어떤 데이터 페

프로젝트를 진행하면서 많은 사람들이 서비스를 이용해봤으면 하는 마음이 있었다. 그러기 위해서 검색에서 상위로 사이트가 떠야했기에 SEO 최적화를 알아봤고 리액트는 <div id="root">...</div>로 항상 감싸져 있고 각 jsx마다 <div>.

Client Side 에서 캐싱은 유용 하면서 굉장히 위험한 기술입니다. 서버 데이터를 fetching 해 데이터를 캐싱한 후, 해당 데이터를 확인할 때 만약 서버 상에서 데이터의 상태가 변경 되었다면, 사용자는 잘못된 데이터를 확인하게 되며, 개발자의 입장에서는 이는

요즘 chatGPT로 세상이 변하는 속도가 더 빨라진 거 같다. 대답을 너무 잘해줘서 변호사 시험도 통과하고 대학 과제도 대신 써주고 인생의 지혜도 제시해 준다. 우리는 성인인 지금 ai가 실생활에 스며든 삶을 천천히 맞이할 텐데 현재 어린이들은 ai가 익숙해져서 우리

시장과 고객의 요구에 빠르게 반응해서 제품을 출시하고 업데이트할지에 대한 고민으로 CI/CD 개발 프로세스를 채택한다.어플리케이션 개발 단계부터 배포 때까지 모든 단계들을 자동화를 통해서 더 효율적이고 빠르게 사용자에게 빈번이 배포할 수 있도록 만다는 것을 말한다.지속

컴퓨터 시스템의 자원은 유한하고, 한정된 자원을 효과적으로 사용하기 위한 방식이다.React는 컴포넌트 기반의 View를 중심으로 한 라이브러리이고 모든 컴포넌트는 세 단계를 거친다.Mount (생성 될 때)Update, Re-render (업데이트 할 때)Unmoun

네이버 지도 API를 쓰기 위해서 클라이언트 아이디를 index.html에 기입해야한다. 자바스크립트 문자로 컴파일되는 다른 HTML이였다면 import.meta.env.변수명을 쓰지만 지금은 다른 방법을 찾아야 한다.vite-plugin-html을 사용해서 환경 변수

Memoization 리액트 생태계에서 렌더링 퇴적화를 위해 사용되는 hook을 알아보기 앞서 useCallback과 useMemo는 메모이제이션된 콜백을 반환하고 값을 반환하기 때문에 메모이제이션(memoization)이 무엇인지 알아본다. 메모이제이션(memoiz

제품 사용성에 대해서 어떤 필자는 프론트엔드 개발자에 대해 이렇게 말한다. "일관된 시각적 계층 구조 유지와 시각적 노이즈를 제거하고, 사용자에게 제공되는 알림, 입력 라벨을 작성하는 것은 제품 사용성에 중요한 역할을 한다." 개발자가 사용성에 대해 고민하는 것은 UX

node_modules는 많은 파일들이 매우 큰 공간을 차지하고 의존성 검색이 비효율적으로 동작한다.Yarn Berry는 node_modules를 생성하지 않는다. 대신 .yarn/cache 폴더에 의존성의 정보가 저장되고, .pnp.cjs 파일에 의존성을 찾을 수 있

프로젝트 소개 우리 팀은 AI기업과 연계했다. 기업에서 제공하는 서비스는 클라이언트가 음성과 아바타를 선택하면 ai가 해당 음성과 아바타로 영상이 만들어진다. 이 기업에서는 기존 웹서비스는 기초적인 모습이였다. 그래서 클라이언트에게 더 나은 서비스 제공이 목표였고 우리

나머지 연산을 완전히 알지 못하고 사용했다.삼항연산자를 사용해서 깔끔하고 짝수인 경우 true가, 홀수인 경우 false가 나온다문자열은 자리수 계산이 가능하다. 숫자.length 숫자+문자 연산을 하면 문자열이 반환된다. split으로 쪼개주고 reduce로 전부 더