반응형 Svelte4 백엔드_파이어베이스(Firebase) 데이터베이스 업데이트 이전에 데이터베이스 세팅을 끝냈으니 이번에는 사용을 해보자 VScode에서 내가 사용할 페이지로 가서 import { getDatabase, ref, set } from "firebase/database"; function writeUserData(userId, name, email) { const db = getDatabase(); set(ref(db, "users/" + userId), { username: name, email: email, }); } 자바스크립트 부분인 상단에 이렇게 작성해 준다. 공식문서에 나온 데이터를 데이터베이스에 올리는 방법이다. 여기서 몇 가지만 수정해서 진행을 할 건데 그전에 내가 뭘 한 건지를 알아야겠다. 이렇게 대충 만든 글쓰기 폼이 있다. 여기에 무언가 데이터를 입.. 2023. 7. 5. 백엔드_파이어 베이스(Firebase) 설치, 배포 Firebase란? 구글에서 서비스하는 서버 개발 없이 DB, 유저 인증, 이미지 업로드, 배포 가능 무료 제공 범위가 넓음 실시간 데이터베이스를 지원 인프라 관리에 신경 쓸 필요 없이 빠르게 애플리케이션 제작 가능 소규모 프로젝트에 적합 파이어베이스는 어떤 아이디어를 검증해보고 싶을 때 주로 사용한다 배포 회원가입과 프로젝트 설치는 쉬우니까 바로 배포로 넘어가 보겠다. 좌측에 빌드창에서 Hosting를 누른다 이런 화면이 나오면 시작하기를 누른다. 이 화면에서 순서대로 진행을 한다. 1번에서 npm 으로 시작하는 부분을 복사해서 VScode 터미널 창에 붙여 넣기하고 설치를 한다. 여기에서 마찬가지로 로그인에 있는 영어 복사해서 터미널창에 입력하는데 입력하면 오류가 뜨게 된다 오류가 뜨면 윈도우 기분 .. 2023. 7. 5. 프론트엔드_스벨트(Svelte) 체험 import svelteLogo from './assets/svelte.svg' import viteLogo from '/vite.svg' import Counter from './lib/Counter.svelte' Vite + Svelte Check out SvelteKit, the official Svelte app framework powered by Vite! Click on the Vite and Svelte logos to learn more .logo { height: 6em; padding: 1.5em; will-change: filter; transition: filter 300ms; } .logo:hover { filter: drop-shadow(0 0 2em #646cffaa); } .. 2023. 7. 5. 프론트엔드_웹 프레임워크 / 리액트(React) / 스벨트(Svelte) 비교 React - jsx라는 리액트만의 문법이 존재 - SPA - 메타(페이스북)에서 만듦 대기업이 만들었으니 관리가 잘 되겠지 라는 안정감 - 가상 DOM - 많은 JS라이브러리와 호환 SVELTE - HTML, CSS, JS문법을 그대로 차용 - 보일러 플레이트(기본틀)가 존재하지 않음 - 가상 DOM이 존재하지 않는다 (컴파일러) - 생태계 부족(TypeScript, IDE 지원 미흡) - Killer 상태 관리 라이브러리가 없음. Svelte React 비교 현재는 단연코 리액트가 대세다 2023. 7. 5. 이전 1 다음 반응형
