FE

| 서론 안녕하세요, 팡입니다! 현재 진행 중인 회고 기록 서비스 “Re:Log” 프로젝트에서 사용자 경험(UX)을 개선한 과정을 공유하고자 합니다. 특히 여러 개의 입력 섹션으로 구성된 회고 작성 페이지는 사용자가 가장 많은 시간을 보내는 핵심 영…

| 서론 안녕하세요. 팡일입니다. SvelteKit 기반 프로젝트 Re:Log를 개발하면서, “alert 대신 깔끔한 토스트 메시지를 띄워보자”는 생각이 들었는데요? 그래서 시작된, 예상보다 긴 “Toast 라이브러리 탐험기”를 공유해보려고 합니다.…

| 서론 안녕하세요, 팡일입니다! 오늘은 Re:Log 프로젝트의 package.json 파일을 살펴보다가, scripts 항목이 어떤 역할을 하는지 하나씩 정리해보았습니다. SvelteKit은 Vite 기반이라 구조가 단순해 보이지만, 각 스크립트가…

| 서론 안녕하세요 팡일입니다. 현재 re:log 프로젝트를 진행하면서, 버튼이나 네비게이션 바 등에서 간단한 아이콘을 함께 넣고 싶을 때가 많았는데요? react-icons와 같이 아이콘을 제공하는 패키지가 무엇이 있을지 찾아보다가 발견한 luci…

| 서론 안녕하세요, 팡일입니다! 오늘은 SvelteKit으로 개발 중인 회고 기록 애플리케이션 ‘Re-Log’의 인증 시스템을 개선한 과정을 공유하려고 합니다. 초기 단계에서는 빠르게 기능을 구현하기 위해, 사용자 ID(userId)를 코드에 하드…

| 서론 안녕하세요 팡일입니다. 지난 포스팅에서는 로그인과 회원가입 기능을 구현했는데요? 단순한 로그인 기능을 넘어서, 이제는 세션을 유지할 수 있는 단계까지 구현하고 싶었습니다. 어떻게 하면 세션을 유지할 수 있을지에 대한 과정을 공유해보려고 합니…

| 서론 안녕하세요! 팡일입니다. 대부분의 사이트에서는 '회원가입'과 '로그인' 과정을 거쳐 사용자를 인증하고 식별한 뒤 서비스를 이용할 수 있게 하는데요? 현재 제가 제작중인 re:log 서비스에서도 사용자 인증 과정이 필요하여, 해당 기능을 구현…

| 서론 Firebase Hosting을 통해 배포를 무사히 끝내고, 기대감을 갖고 배포 주소로 접속했지만,, 제가 마주해야 했던 것은 위의 사진과 같은 모습이었습니다. 즉, 제가 작업했던 내용이 배포 과정에 반영되지 않았던 것이었습니다. 보통 이런…

| 서론 안녕하세요! 팡일입니다. 오늘은 SvelteKit 환경에서 Markdown Editor를 구현하면서 겪은 시행착오와 결국 markdown-it 기반 커스텀 방식으로 정착하게 된 이유 및 사용방법에 대해서 공유해보려고 합니다. 처음에는 이미 …

| 서론 이번 포스팅에서는 Svelte(SvelteKit)에서 페이지 이동(라우팅)에 대해서 알아보려고 합니다. Svelte(특히 SvelteKit)에서는 페이지 이동(라우팅)이 기본적으로 '내장'되어 있어서, 별도의 react-router나 vue…

| 서론 SvelteKit 기반의 Re:Log 프로젝트를 npm run dev로 실행했는데, 시작하자마자 콘솔에 아래와 같은 로그가 떴습니다. [404] GET /apple-touch-icon-precomposed.png [404] GET /appl…

| 서론 SvelteKit 기반 Re:Log 프로젝트에서 실행했더니, '.svelte-kit'라는 폴더가 생겼는데요? 해당 폴더가 왜 생겼고, 무엇을 하는 것인지 정리한 내용을 공유해보려고 합니다. | 왜 만들어진거지? .svelte-kit 폴더는 …