diff --git a/README.md b/README.md new file mode 100644 index 0000000..2e69498 --- /dev/null +++ b/README.md @@ -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. + +![FINAL API ](https://github.com/tokslaw7/Tokslaw_FullStack_with_prismaDB/blob/main/snapshots/frontend_dark_theme.png?raw=true) + + +## 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 +