https://github.com/arnaudband/era92_web_design
To create a visually engaging, user-friendly website that provides information about the nonprofit's programs and enables users to donate seamlessly.
https://github.com/arnaudband/era92_web_design
eslint-rules linux nextjs15 react18 tailwindcss typescript
Last synced: about 2 months ago
JSON representation
To create a visually engaging, user-friendly website that provides information about the nonprofit's programs and enables users to donate seamlessly.
- Host: GitHub
- URL: https://github.com/arnaudband/era92_web_design
- Owner: ArnaudBand
- License: mit
- Created: 2024-10-30T18:58:10.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-11-01T12:38:44.000Z (6 months ago)
- Last Synced: 2025-01-15T10:03:06.522Z (3 months ago)
- Topics: eslint-rules, linux, nextjs15, react18, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://era92-web-design.vercel.app
- Size: 13.7 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Project Title: Full Website Development for a Nonprofit with Interactive Features
### Overview
This project involves the development of a multi-page website for a nonprofit organization focused on community development. The website integrates both visual appeal and functionality to effectively communicate the nonprofit’s mission, engage users, and facilitate donations.
### Objective
To create a visually engaging, user-friendly website that provides information about the nonprofit's programs and enables users to donate seamlessly.
### Pages
The website consists of the following three pages:
1. **Homepage**:
- A visually engaging landing page that communicates the nonprofit’s mission.
- Features a hero banner, highlighted programs, and calls to action.
2. **Program Page**:
- A dedicated page showcasing the organization’s programs.
- Features an interactive map for users to explore various community impact locations.
3. **Donation Page**:
- A user-friendly interface for donations.
- Includes suggested donation amounts, recurring donation options, and a thank-you screen.
### Advanced Features
- **Interactive Map**:
- Implemented using Leaflet or Google Maps API to showcase community impact locations.
- **Donation Flow**:
- Designed a smooth donation process with clear user prompts and navigation.
- **Engagement Widgets**:
- Integrated widgets for "Latest News" and "Upcoming Events" on the homepage.
- **Responsive Design**:
- The website is fully responsive, providing an optimal viewing experience across mobile, tablet, and desktop devices.
### User Experience Considerations
- Documented the user journey for each page.
- Provided a brief explanation of design choices and functionalities implemented.
### Technology Stack
- **Frontend**: React, Next.js, Tailwind CSS
- **Map Integration**: Leaflet or Google Maps API
- **Backend**: Node.js (if applicable)
- **Deployment**: Vercel, Netlify, or any preferred hosting solution
### Installation
1. Clone the repository:
```bash
git clone [email protected]:ArnaudBand/era92_web_design.git
```
2. Navigate to the project directory:
```bash
cd era92_web_design
```
3. Install dependencies:
```bash
npm install
```
4. Run the development server:
```bash
npm run dev
```
5. Open [http://localhost:3000](http://localhost:3000) to view the website.