README added
This commit is contained in:
@@ -0,0 +1,81 @@
|
|||||||
|
# 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
|
||||||
|
|
||||||
|
* Main: (https://github.com/tokslaw7/TABORG_API.git)
|
||||||
|
|
||||||
|
|
||||||
|
## Additional Documentation and Acknowledgments
|
||||||
|
|
||||||
|
* Project folder on server: TABORG_API
|
||||||
|
|
||||||
Reference in New Issue
Block a user