> For the complete documentation index, see [llms.txt](https://verifund.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://verifund.gitbook.io/docs/getting-started/frontend-application.md).

# Frontend Application

The Verifund frontend is a web application that serves as the user interface for campaign creators, donors, and platform administrators. It provides seamless interactions with the smart contracts and ensures a smooth user experience across the platform.

### Setup & Installation

To set up the Verifund frontend application, follow these steps:

#### Prerequisites:

* Node.js (v14.x or later)
* npm (v6.x or later) / Yarn (optionally)

#### Installation Steps:

1. **Clone the Repository**

   ```bash
   git clone https://github.com/Verifund-Team/verifund-client.git
   cd verifund-client
   ```
2. **Install Dependencies**

   ```bash
   npm install
   # or
   yarn install
   ```
3. **Environment Configuration**
   * Copy the `.env.example` to `.env`
   * Fill in the necessary configuration for API endpoints and app keys

     ```
     REACT_APP_API_URL=https://api.yourplatform.com
     REACT_APP_LISK_NODE=https://lisk-node.yourplatform.com
     ```
4. **Run the Development Server**

   ```bash
   npm start
   # or
   yarn start
   ```
5. **Build for Production**

   ```bash
   npm run build
   # or
   yarn build
   ```

### Architecture Overview

The Verifund frontend is structured as a single-page application (SPA) using React.js. The application follows a modular design pattern, encapsulating UI components, services, and state management in dedicated folders.

#### Key Folders:

* **/src/components**
  * Houses common UI components like buttons, forms, and modals
* **/src/pages**
  * Contains main pages such as Home, Campaigns, and Profile

#### Routing

* The application employs [React Router](https://reactrouter.com/) for routing, enabling dynamic navigation without page reloads.

***

Continue to Setup & Installation for detailed installation steps and configurations.