개발

[Next.js + prisma + planetScale] Cheer luv 목표 공유 앱

서비스 부터 소개하겠습니다. 목표를 공유하고 응원하는 간단한 Todo App입니다~ 신년 목표를 작성하고 서로 응원하는 시간을 가져봐요! cheer luv - 목표를 공유해요 cheer-luv.vercel.app To Do List를 갑자기 개발한 이유 완전 J인 사람이라 신년 목표를 계획하고 있었는데 뭘 해야할지 고민이 됐어요. '다른 사람의 신년 목표는 무엇일까?' 생각이 들어서 목표를 공유하는 서비스를 개발하게 됐습니다. 요즘 MVP 개발을 최대한 빠르게 하는걸 목표로 여러가지 알아보고 있는데, Next + Prisma + planetScale을 이용하면 풀스택 어플리케이션을 개발할 수 있을 것 같아서 기술 공부 목적으로 개발했습니다. Next를 애용하는 사람 중 한 명인데, api 기능은 써본적이..

가설 검증 계획하는 법

스타트업이 하는 일은 가설 세우기와 검증이 전부다. 이 두 가지가 아니라, 다른 일을 하고 있다면, 스타트업이 아니거나 곧 아니게 될 것이다. 단정 지어 말할 수 있을 정도로 가설은 정말 중요하다. 이전 포스트에서 가설을 쉽게 세우는 방법에 대해 살펴봤었다. 방법이 궁금하다면 아래 포스트를 확인하면 된다. 가설을 쉽게 세우는 방법 '가설을 어떻게 세워야 하는 걸까...?' 최근 창업을 준비하면서 겪었던, 가설 수립의 어려움을 공유하고자 한다. 스타트업이 하는 일은 '고객', '제품', '시장'의 불확실성을 해소하는 것이다. 일반 mujidog.tistory.com 이번 포스트에서는 세운 가설을 어떻게 검증할 것인지 계획하는 방법을 공유해보자 한다. 계획부터 시작하자. 초기 스타트업은 시간이 정말 소중하기..

[React-query] 기존 Query Data 갱신, 삭제하는 법

서비스를 만들다 보면 어떤 동작을 했을 때, 기존의 데이터를 새롭게 받아오거나, 삭제해야 하는 경우가 있다. 예를 들면, 다음이 상황이 있을 수 있다. 새로운 포스트를 작성했을 때, 포스트 데이터를 새롭게 받아오는 상황 로그아웃을 했을 때, 사용자 프로필 데이터를 삭제하는 상황 이번 시간에는 React-query를 사용할 때, 기존의 데이터를 갱신하는 법과 삭제하는 법에 대해서 알아보겠다. React-query를 이용해 데이터 받아오기 React-query는 서버 상태 관리 라이브러리 중 하나이다. 해당 글에서 React-query의 자세한 사용 방법은 다루지 않겠다. 구체적인 사용 방법이 궁금한 사람은 아래의 공식문서를 확인하는 것을 추천한다. TanStack Query | React Query, S..

SSR에서 로그인 유무 확인하기 (Feat. Next.js)

서비스를 개발하다 보면, 사용자의 로그인 유무에 따라 다른 화면을 보여줘야 하는 경우가 있다. 예를 들면, 로그인하지 않은 사용자에게는 로그인 버튼을 보여주고, 반대로 로그인한 사용자에게는 프로필이나 로그아웃 버튼을 보여주는 식이다. 이번 시간에는 SSR에서 로그인 유무를 확인하는 방법을 공유하고자 한다. 일러두기 해당 글에서는 원활한 소통을 위해 SSR을 Frontend의 Server, CSR을 Fronted의 Client의 의미로 사용할 것이다. 개발환경 Typescript React Next.js JWT axios @tanstack/react-query nookies 기존 CSR에서 처리하는 방법 SSR에서 처리하는 방법을 알아보기 전에, 기존 CSR에서 어떻게 했는지 소개하겠다. 전통적인 방법 일..

[사이드 프로젝트] solomon 고민 플랫폼 - 기술 스택 결정 (16)

이번시간부터 본격적으로 개발을 시작한다. 오늘은 어떤 스택을 사용해서 개발할지 정하는 시간을 가져보겠다. 기술 스택을 결정하는 기준 이번 프로젝트는 개발보다는 가설 검증과 서비스 활성화에 초점을 맞추고 있기 때문에 개발은 최대한 빠르고 적은 리소스로 하고 싶다. 그래서, 새롭게 공부해야 하는 기술보다는 알고 있고 익숙한 기술을 사용해 개발하려고 한다. 결정한 기술 스택 나는 프론트를 주로 공부하고 개발해서, 서버나 인프라에 대한 지식은 아직 부족하다. 그나마, 사용할 줄 아는 기술들을 이용해보려고 한다. Client Git, Github Yarn berry Typescript React, Next.js Zustand React-query tailwindcss Server Typescript Node, k..

[사이드 프로젝트] solomon 고민 플랫폼 - 백로그 작성하기 (15)

우리는 가설 검증을 위해 MVP를 개발하고 있다. 이번 시간에는 서비스 기획을 바탕으로 백로그를 작성하고, 우선순위와 예상 소요 시간을 계산해 보겠다. 어떤 기능을 만들어야 하지? 지난 시간에 정했던 세부 기능들은 다음과 같다. 로그인/회원가입 네이버 소셜 로그인 투표 기능을 포함한 고민 작성 제목과 본문 익명 기능 두 개의 선택지를 필수적으로 작성할 것 레벨 시스템 및 랭킹 페이지 solomon power 자신과 상위 5명 오늘의 첫 답변 보너스 가벼운 답변 +5, 신중한 답변 +30 오늘의 첫 신중한 답변 +60 마이페이지 중복 불가능한 닉네임 설정 내가 작성한 고민 피드백 기능 텍스트 형식의 요청사항 작성 이를 기반으로 백로그를 작성해 보겠다. 백로그 작성하기 백로그를 작성하고 우선순위를 결정하는 ..

[사이드 프로젝트] solomon 고민 플랫폼 - 어떻게 개발할까? (14)

이번 시간부터 개발을 시작한다. 오늘은 어떤 방식으로 작업할 건지 결정하고 효율적으로 진행할 수 있도록 규칙을 만들도록 하겠다. 어떤 방식으로 작업할까? 개발에서 가장 중요한 것은 일정 맞추기라고 생각한다. 어떻게 하면 더 빠르고 효율적으로 개발할 수 있을지 고민해본 결과, 다음 방식으로 개발하기로 결정했다. 백로그를 작성한다. 백로그 별로, 우선순위와 예상 소요 시간을 계산한다. 우선순위를 기반으로 개발한다. 개발 규칙 독립적으로 개발해, 언제든지 런칭할 수 있도록 한다. 코드 퀄리티보단 속도를 우선한다. 다음 시간에는 백로그를 작성하고 우선순위와 예상 소요 시간을 계산해 보겠다. 의견이나 피드백은 댓글 남겨주세요!

[사이드 프로젝트] solomon 고민 플랫폼 - 디자인 (13)

이번 시간에는 디자인 작업 과정을 공유하고자 한다. 어떻게 디자인하지? 간략하게 디자인 시스템을 만들었다. 개발에 도움 될 수 있도록 간략하게 디자인 시스템을 만들었다. Mobile Desktop 디자인을 하면서 추가적으로 필요해 보이는 사항들을 추가했다. 다음시간부터는 개발을 시작할 것이다. 의견이나 피드백은 댓글 남겨주세요!

[사이드 프로젝트] solomon 고민 플랫폼 - IA 및 와이어프레임 (12)

현재까지 가설검증을 위해 MVP를 개발하고자, 필요한 기능들을 기획했다. 이번에는 IA와 와이어프레임을 작성한 과정을 공유해보고자 한다. 시작하기전에 이 말을 하고 싶다. 문서는 기록과 공유를 위함이다. 정답은 없다. 나는 회사에서 일해본 경험도 없고 교육도 받아본 적이 없으며, 스스로 독학을 했기에 부족하거나 다른 부분이 있을 수 있다. 우리가 하고 있는 일은 좋은 서비스를 만드는 일이지, 보기 좋은 문서를 만드는 일이 아니라고 생각하기에 잘못된 부분은 너그럽게 이해해줬으면 한다. 의견이나 피드백은 댓글 남겨주세요. - 멍태현 - IA (Information Architecture) 나는 IA를 미니맵이라고 생각한다. 그래서 서비스의 구조를 간단하게 요약할 수 있게 작성했다. 저번시간에 작성한 구체적인..

[사이드 프로젝트] solomon 고민 플랫폼 - MVP 서비스 기획 : 세부사항 (11)

현재 가설 검증을 위한 MVP를 제작하고 있다. 저번 시간에 MVP에 필요한 기능들을 기획했고, 이어서 세부사항들을 정해보려고 한다. 어떤 기능을 만들 거라고? 로그인/회원가입 투표 기능을 포함한 고민 작성 투표 기능을 포함한 고민 답변 랭킹 시스템 및 랭킹 페이지 오늘의 첫 답변 보너스 마이페이지 (추가) 피드백 기능 (운영자에게 의견 남기기) '우린 이런 서비스야'라는 느낌을 주는 것이 목적이기 때문에, 완벽함보다는 최대한 빠르게 만들 수 있도록 세부사항을 정하고자 한다. 기능 세부사항을 정해보자. 로그인/회원가입 아래의 자료는 2019년 한국 소비자 연맹에서 '소셜 로그인 사용'에 대해 조사한 통계자료이다. 해당 자료에 의하면, 사용자는 소셜 로그인을 선호하는 것으로 나타난다. 현재 대부분의 서비스..