> For the complete documentation index, see [llms.txt](https://iron-network.gitbook.io/reactify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/build-an-app-from-scratch.md).
# Build an App from Scratch
Please follow the below documentation to learn how you can build an app from the scratch.
You can easily build your app from scratch, just follow the steps given below:
1. Copy the project files from the downloaded **ThemeForest** project.
2. Open terminal and go to the root directory and then run `npm install`.
3. After installing npm then run `npm start`.
4. Open your browser and access [`http://localhost:3000`](http://localhost:3000).
## **Integrate New Widget**
Please follow the [Adding New Widgets](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/widgets) section to learn how to add new widgets in the template.
## **Integrate New Component/Page**
### For **seed project**:
By default seed project contains dashboard page means you can easily build your dashboard.
If you want to add some **pre-made components or pages** then follow below steps:
**Step 1:** Copy the page template from `reactify-redux-thunk->src->routes` of downloaded **ThemeForest** files and paste it into under the `your-app-directory->src->routes` directory.
**Step 2:** Now you need to define the route in the `your-app-directory->src->services->_routerService.js` file. Let us take an example of adding simply a `Pages` component that adds a blank page in your template. Also you need to import the component in the desired area like in the code given below:
{% code title="\_routerService.js" %}
```javascript
import Dashboard from 'Routes/dashboard';
// Import the component here
import Pages from 'Routes/pages';
export default [
{
path: 'dashboard',
component: Dashboard
},
// Newly Added Component
{
path: 'pages',
component: Pages
}
]
```
{% endcode %}
**Step 3:** Open the file `components->AsyncComponent->AsyncComponent.js` and define the component in the async components and export it in the area defined in the given code snippet.
{% code title="AsyncComponent.js" %}
```javascript
/**
* AsyncComponent
* Code Splitting Component / Server Side Rendering
*/
import React from 'react';
...
// Define the Pages Component
const AsyncBlankComponent = Loadable({
loader: () => import("Routes/pages/blank"),
loading: () => ,
});
export {
...
// Export it here
AsyncBlankComponent
};
```
{% endcode %}
**Step 4:** That’s it if you navigate [`http://localhost:3000/app/pages/blank`](http://localhost:3000/app/pages/blank) . The page has been build successfully.
If you want to **add some new components** by your own, then follow the steps mentioned below:
Please check this [Adding Menu/Component In Different Layouts](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/layouts/adding-menu-in-different-layouts) section to get detailed information on this.
### For complete template:
If you are using the complete template then you are able to add only new components or pages & for that you have to follow the below mentioned steps:
Please check this [Adding Menu/Component In Different Layouts](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/layouts/adding-menu-in-different-layouts) section to get detailed information on this.
## Integrating Menu
If you want to add menu items then please check this section [Adding Menu/Component In Different Layouts](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/layouts/adding-menu-in-different-layouts) for the detailed information.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/build-an-app-from-scratch.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.