그랜파 개발자의 풀스택 공부

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.등록 업체 보기(홈)홈페이지에 등록한 모든 업체들을 보여 줍니다.업종을 선택하면 해당 업종의 업체들만 볼 수 있습니다. 업체 리스트에서 업체를 클릭하면 업체 정보 상세 보기로 이동합니다. 로그인 한 상태라면 ‘예약 하기’ 버튼을 볼 수 있고,예약 하기를 누르면 예약 화면으로 이동합니다. src/stores/companyStore.js🔹 업체 목록 : fetchAllCompanies// src/stores/companyStore.jsimport { defineStore } from 'pinia'import { ref } from 'vue'import { db } from..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.회원의 업체 관리회원은 여러 업체를 등록할 수 있습니다.회원이 등록한 업체는 등록한 회원이 관리자가 됩니다. 회원은 여러 업체를 등록할 수 있습니다.회원이 등록한 업체는 등록한 회원이 관리자가 됩니다.등록한 업체의 정보는 수정, 삭제할 수 있습니다.companies collection업체는 firestore의 companies 컬렉션에 저장을 합니다. companies collection 구조는 다음과 같습니다.{ name: '업체명', description: '소개글', category: '배달음식', ownerUid: 'userUid', createdAt: ..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.구글 계정으로 로그인Firebase Authentication의 이메일과 비밀번호로 회원 가입을 하지 않고구글 계정으로 로그인하는 기능을 구현합니다. 구글 계정으로 로그인하여 프로필 정보를 생성하면앱에 접속을 할 때는 구글 계정으로 로그인을 해야 합니다.만약 Firebase Authentication의 이메일과 비밀번호로 회원 가입을 한 사용자가구글 계정으로 로그인을 하여 다른 프로필을 생성하면이 두 계정을 각 다른 사용자로 인식합니다. 구글 계정으로 로그인 기능을 구현하기 위해서는 Firebase Authentication의 GoogleAuthProvider와 si..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.비밀번호 변경, 비밀번호 재설정보안상의 이유로 비밀번호는 주기적으로 변경하는 것이 좋습니다.비밀번호 변경은 로그인 후에 가능하므로 프로필 페이지 기능을 둡니다.비밀번호 리셋 기능을 비밀번호를 잊었을 때 사용합니다.비밀번호 리셋 기능을 로그인 페이지에 기능을 둡니다.비밀번호 변경보안상의 이유로 비밀번호는 주기적으로 변경하는 것이 좋습니다.비밀번호 변경은 로그인 후에 가능하므로 프로필 페이지 기능을 둡니다. updatePassword()는 Firebase Authentication에서 현재 로그인된 사용자의 비밀번호를 새 비밀번호로 변경할 때 사용하는 메서드입니다. 비밀번호를 ..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.회원등록, 로그인 기능 구현Vue 3 + Vuetify + Firebase + 상태관리(Pinia)를 사용하여 이메일/비밀번호 회원등록 및 로그인 기능을 구현합니다.createUserWithEmailAndPassword - 새 사용자 생성 (회원 가입)Firebase Authentication에서 이메일과 비밀번호를 사용해 새 사용자를 생성할 때 사용하는 메서드입니다. 주로 웹 앱이나 모바일 앱에서 사용자 회원가입 기능을 구현할 때 사용됩니다. signInWithEmailAndPassword - 기존 사용자 로그인 Firebase Authentication에서 이메일과..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다.Vue 3 + Vite + Vuetify 3 + JS 프로젝트 세팅1. 프로젝트npm create vite@latest booking-portal -- --template vue cd booking-portal 2. 의존성 설치npm install vuetify@^3 @mdi/font sass vite-plugin-vuetify3. vite.config.jsimport { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import vuetify from 'vite-plugin-vuetify'export defa..

Firebase Hosting으로 실제 웹 서비스 오픈까지 진행합니다.서비스 오픈까지 개발을 진행하면서 계속 수정, 변경될 것입니다. 내 주변의 여러 상점이 함께 사용하는 '내 주변 포털'을 개발합니다.'내 주변 포털'은 내 주변의 여러 상점에 예약을 하거나,또는 온라인으로 테이크 아웃 주문할 수 있는 포털 웹 페이지입니다. Vue, Vuetify, Firebase를 활용해 개발합니다.이 조합은 빠른 개발, 실시간 기능, 확장성에 매우 적합합니다.아래는 시스템 아키텍처와 주요 기능을 고려한 설계 및 개발 로드맵입니다.🔧 기술 스택프론트엔드: Vue 3 + Vuetify 3 + Vue Router + Pinia (상태관리)백엔드/DB: FirebaseAuthentication: 이메일/소셜 로그인Fire..

Eclipse에서 Spring Boot 프로젝트 생성🔹 사전 준비JDK 17 이상Eclipse IDE (최신)Maven 설치 (또는 Eclipse 내장 Maven 사용)MySQL 실행 중🔹 Step 1: Spring 프로젝트 생성Eclipse 실행 → File → New → Spring Starter Project프로젝트 정보 입력:Name: reservationType: MavenPackaging: JarJava Version: 17Language: JavaGroup: com.exampleArtifact: j reservationDependencies 추가:Spring WebSpring Data JPASpring Boot DevTools (선택)Spring SecurityMySQL DriverLom..

프로젝트npm init vue@latestProject name (target directory):│ reservationcd reservationnpm installnpm install vue-router@4 vuetify@3 axios plugins - axios.js// src/plugins/axios.jsimport axios from 'axios'import { useAuthStore } from '@/stores/authStore'axios.interceptors.request.use((config) => { const auth = useAuthStore() if (auth.token) { config.headers.Authorization = `Bearer ${auth.token}..

홈 회원가입로그인예약하기 회원 - 예약조회, 예약 취소 관리자 - 예약 조회, 승인, 거부 예약 날짜 선택