React Typescript Firebase example: CRUD with Realtime Database

Build a React Typescript and Firebase Realtime Database CRUD example with Router & Bootstrap 4.

It is the React Tutorial Application in that:

• Each Tutorial has id, title, description, published status.
• We can create, retrieve, update, delete Tutorials.

For instruction, please visit:

React Typescript Firebase example: CRUD App

Related Posts:

React Typescript Firestore example: CRUD App

React Typescript example Project with Axios and Web API

React Hooks Typescript example Project with Axios and Web API

React (Javascript) CRUD example to consume Web API

React Redux CRUD App example with Rest API

React (Hooks) CRUD example to consume Web API

React Table example: CRUD App with react-table v7

Using Material UI instead of Bootstrap:

React Material UI examples with a CRUD Application

More Practice:

React Pagination example

React File Upload example

React JWT Authentication & Authorization example

React + Redux: JWT Authentication & Authorization example

Fullstack with Node Express:

React + Node Express + MySQL

React + Node Express + PostgreSQL

React + Node Express + MongoDB

Fullstack with Spring Boot:

React + Spring Boot + MySQL

React + Spring Boot + PostgreSQL

React + Spring Boot + MongoDB

Fullstack with Django:

React + Django Rest Framework

Integration (run back-end & front-end on same server/port)

Integrate React with Spring Boot

Integrate React with Node Express

This project was bootstrapped with Create React App.

Set port

.env

PORT=8081

Project setup

In the project directory, you can run:

npm install
# or
yarn install

or

Compiles and hot-reloads for development

npm start
# or
yarn start

Open http://localhost:8081 to view it in the browser.

The page will reload if you make edits.