본문 바로가기

개발 171

[Phoenix] Phoenix LiveView 간단 리뷰 들어가며 이번 글에서는 Phoenix LiveView(이하 라이브뷰)를 다뤄보면서 느꼈던 장단점을 리액트와 비교하면서 느낀 점을 적어보도록 하겠습니다. 리액트는 4년차, 라이브뷰는 이제 막 사용해 본 뉴비입장으로 쓴 글이니 참고 바랍니다. Phoenix LiveView란 Phoenix liveview의 공식 설명을 살펴보고 가겠습니다. Phoenix LiveView enables rich, real-time user experiences with server-rendered HTML. - https://github.com/phoenixframework/phoenix_live_view 풍부하고, 실시간의 유저 경험을 지원하는 서버에서 랜더링 된 HTML이라고 되어있습니다. 이것만 보면 그냥 html를 랜더.. 2023. 7. 23.
[Phoenix] 피닉스 프로젝트에 tailwind 자동완성 추가하기 들어가며 최근에 시작한 사이드프로젝트에서 엘릭서 +피닉스 + 라이브뷰를 조합하여 프로젝트를 진행해보기로 했습니다. 저는 그중에 tailwind css를 이용한 퍼블리싱을 맡게 되었는데요. 이번 글에서는 vsc상에서 tailwind css의 자동완성과 하이라이팅을 위한 셋팅법을 소개해드리고자 합니다. 여기에선 익스텐션 1개와 vsc의 setting.json에 추가할 값으로 원하는 목표를 달성해보겠습니다. 코드 하이라이팅 아직 여러가지를 써본것이 아니라 어떤것을 추천하기엔 어렵지만 가장 기본적인 익스텐션은 Phoenix Framework입니다. 설명란에도 친절하게 Syntax highlighting support for Phoenix templates. 라고 되어있습니다. Phoenix Framework -.. 2023. 7. 15.
[상태관리] Zustand 조금 더 편하게 쓰기 ( snippet ) 들어가며 편리함을 추구하는 프론트엔드 개발자 핸디입니다. 저번 글에 이어서 이번 글에서는 Zustand를 조금 더 편하게 사용하는 방법에 대해 알아보도록 하겠습니다. [상태관리] 내가 Zustand를 선택한 이유 (over the Recoil) 들어가며 편리함을 추구하는 프론트엔드 개발자 핸디입니다. 최근에 새롭게 진행한 사이드프로젝트에서는 recoil 대신에 zustand를 사용해 보았습니다. 그래서 이번 글에서는 zustand와 Recoil를 비교 all-dev-kang.tistory.com Snippet Extension 우리가 개발을 하다보면 많은 Extension를 만납니다. 이미 react snippet를 쓰고 있는 저에겐 snippet extension는 코파일럿보다 훨씬 중요한 도구인데요... 2023. 7. 10.
[개발회고] 23년 6월 회고 개발 이번달의 핵심 개발은 SEO와 유지보수라고 할 수 있겠다. 외주로 만들어진 홈페이지에 대한 유지보수가 시작되었다. 그리고 빠진 기능에 대한 리스트가 왔고.. 내가 이를 넘겨받아서 개발을 해야만 하는 상황이되었다. 우선적으로 수정해야할 기능은 SEO였는데, 기존에 만들어진 블로그에서 SEO를 글어와서 DB에 넣고 이를 새로운 사이트에 올리는 작업부터, 관리자가 임의로 설정한 SEO값을 적용하는 기능까지 SEO의 시작부터 끝을 달려봤다. 특히 Next.js에서 SEO를 위해 Next-seo라는 라이브러리를 사용하는데, 다이나믹한 SEO의 경우 동작하지 않아 이를 변경하는데 상당히 귀찮았다. next-seo의 경우 자바스크립트를 이용해 head의 meta를 건드리는 작업을 대신해주는 라이브러리인데, 카카.. 2023. 7. 1.