2.1 KiB
2.1 KiB
FullStack Project with PrismaDB
A web application that fetches data from a random, free API, and displays it in a user-friendly and visually appealing way using HTML and CSS. The project is setup via using Vite, and API calls are made using Axios with Async/Await.
Getting Started
- Clone project from
https://github.com/tokslaw7/Tokslaw_FullStack_with_prismaDB.git
- Code are organized into multiple modules for better maintainability.
- A clear, concise folder structure, including folders for HTML, CSS, and JavaScript files
Prerequisites
The things you need before installing the software.
- An IDE
- Node install on machine
- Npm install on machine
Installation
A step by step guide that will tell you how to get the development environment up and running.
$ npm create vite@latest frontend -- --template vanilla
$ npm install
$ npm run dev
Create a Schema Using Prisma
mkdir backend
npm install prisma@6.7.0
Usage
Data fetch from API
Separate JavaScript module for handling the data and rendering it on the webpage.
HTML to structure the data in a user-friendly and visually appealing way.
CSS styles to make the data visually appealing
Functionality
- User interactions, such as buttons or input fields, to trigger and control the API requests.
- Implemented error handling to display a user-friendly message in case the API request fails.
Deployment
-
To import an existing project:
-
Go to your team’s Projects page, open the Add new project menu, and select Import an existing project.
-
Select the Git provider where your project is hosted.
-
Select your project’s existing repository.
-
Adjust site and build settings if necessary.
-
Select Deploy site.
Server
- Live: Netlify
- API Project (https://taborgapi.netlify.app/)
Branches
Additional Documentation and Acknowledgments
- Project folder on server: TABORG_API
