본문 바로가기

전체 글307

Server Driven UI 개념앱이 페이지를 그리는데 필요한 정보를 API를 통해 얻어서 페이지를 렌더링 이점 - 앱 배포 시 심사를 걸쳐야 하기 때문에 배포가 원하는 시점에 되기 힘들지만, 서버만 배포하면 되기 때문에 유연하게 대응 가능 - A/B 테스트를 클라이언트 변경 없이 가능 - 하나의 서버에서 여러 플렛폼의 클라이언트 또는 서로 룩이 비슷한 서비스의 클라이언트를 대응해야 할때 용이 의견아래의 글에서는 graphql를 추천하지만, rest로도 충분히 가능하다고 봄서버에서 타입을 가져오는 방법이 graphql 뿐만 아니라 swagger doc으로도 충분함하위호환성 부분도 graphql, rest 상관없이 서버가 뭘 내려주던  클라이언트에서 어차피 예외처리할 때 같이 다뤄지기 때문에 상관 없음  https://devblog... 2024. 11. 18.
[영화 후기] 열정같은소리하고있네 주말에 게임하기도 귀찮고 유튜브 보는것도 재미 없을 때 보기 좋은 영화다. 요즘 유튜브 추천에 너무 많이 나와서 보게되었다.  별점4/5  후기여러가지로 재미 요소가 있었다.MZ와 기성세대와의 갈등 요소가 여러가지 있었다.영화에서 보여주는 갈등들이 내가 일할 때 느끼고 경험했던 부분들이 있어서 재미있게 봤다.   https://serieson.naver.com/v2/movie/130302 열정같은소리하고있네 - 네이버 시리즈온취업만 하면 인생 제대로 즐기리라 생각한 햇병아리 연예부 수습기자 ‘도라희’(박보영). 몸에 딱 맞는 정장에 하이힐을 신은 완벽한 커리어우먼…! 이 모든 환상은 첫 출근 단 ...serieson.naver.com 2024. 11. 17.
[firebase > firestore database] 검색 기능 구현하기 기본적으로 firestore는 문자열 안에 포함되어 있는 단어 검색을 제공하지 않는다. 그래서 RDB에서 흔히 어떤 단어가 포함되어 있는지 질의하는게 당연한건데,, 지원하지 않는다. 그래서 약간의 꼼수로 어느정도 가능하게 할 수 있지만, 100% 커버되는건 아니다.검색이 중요하다만 타사 솔루션 Algolia 또는 Elastic을 사용해야 한다. 꼼수 방법 1문자열 첫단어를 검색하는 방법 (중간에 있는 문자는 찾을 수 없다.)**`\uf8ff`를 넣는 이유는 유니코드 범위에서 상당히 뒷자리에 위치하고 있어서 우리가 사용하는 어떤 문자열이 들어와도 검색이 가능하게끔 한다.const q = query( hashtagRef, where('__name__', '>=', value), where('__name.. 2024. 11. 17.
디자인 시스템의 깨진 약속들 아래의 글을 보고 핵심과 나의 생각을 정리합니다.디자인 시스템의 깨진 약속들(The broken promises of design systems) 디자인 시스템의 깨진 약속들(The broken promises of design systems)매년 Figma에서 개최하는 Config에서 올해(2024)의 Config 영상 중 하나가 좋았어서(해당 영상) 이를 글로 정리하고자 해요.minnimalism.medium.com이 글을 보면 대략 디자인시스템을 적용 후 안좋은 의견들이 많다.- “느리고, 제한적이다. 그들이 없길 바란다…”- “더 나은 디자인을 위한 해결책이 디자인 시스템이라고 하는 리뷰는 아직 경험해보지 못했습니다.”- “창의력을 저하시킨다. 혁신적인 디자인을 하기에는 너무 경직되어 있다” 속도.. 2024. 11. 16.
[web] tree-shaking 요약 webpack 기준 tree-shaking 적용 방법1. bundle 시 commonjs로 transpile이 되면 안됨 .babelrchttps://babeljs.io/docs/babel-preset-env#modules> Setting this to false will preserve ES modules.{ "presets": [ ["env", { "modules": false }] ], "plugins": [ ["transform-react-jsx", {"pragma": "h"}], "emotion" ]} 2. 필요한 함수만 import// asisimport * as utils from "../../utils/utils";// tobeimport { simpl.. 2024. 10. 27.
[web] 사용되지 않는 자바스크립트 및 CSS 찾기 아래의 글을 요약했습니다.https://developer.chrome.com/docs/devtools/coverage?hl=ko 적용 범위: 사용되지 않는 자바스크립트 및 CSS 찾기  |  Chrome DevTools  |  Chrome for DevelopersChrome DevTools에서 사용되지 않는 자바스크립트 및 CSS 코드를 찾고 분석하는 방법developer.chrome.com너무 쉽습니다. 몇년전에도 해당 기능을 알았지만 까맣게 잊고 있었네요. 오!! 이런것이 있어? 하면서 놀랬지만 이 글을 쓰는 시점에서는 '아.. 알고 있었는데..' 사용방법크롬 > 개발자 도구 > 범위 > 리프레스 버튼 > 녹화 중지*범위가 없으면 더보기(삼점)버튼 눌러서 범위 선택 테스트 2024. 10. 23.