1. Item Name : Gratech - IT Service React Next js Template
2. Created: 17 May 2025
3. Item Version : v 1.0.0
4. Author : Gramentheme
5. Support Ticket: gramen.theme@gmail.com

## Introduction

#### Gratech - IT Service React Next js Template Documentation

For any support please don't hesitate to contact us at Support Center. We provide 13 hours real-time support for our customers.

We would like to thank you for choosing Gratech.

### Getting started

Gratech IT Service React Next js Template – If you’re envisioning a technology business and considering a sleek online presence, Gratech is the ideal choice. Tailored for IT service providers, software companies, and web design firms, this React Next js template boasts an array of features for a professional and visually appealing website. Designed with customizability in mind, Gratech is crafted using the latest web technologies to ensure a seamless user experience.

## Requirements

There are system requirements in order to install and setup Gratech template and its components properly. Make sure that you are installed node.js and Yarn.

#### For nodejs go here Nodjs

#### For yarn go here Yarn

#### Install Yarn

#### Template Features

- Latest NextJs 15.3.2 (app directory)
- React JS
- Dynamic Cotact Form
- TypeScript
- Based on Bootstrap 5.x
- Flat, modern and clean design.
- Cleaning on-page optimized.
- Free Premium Quality Support
- Sticky Header
- Google Fonts
- 100% Responsive
- Nice and Clean Design
- Clean and commented code
- Customizeable all components of each page
- Integrated with FontAwesome
- 4 Home Pages
- 16+ Inner Pages
- Blog Pages
- Image background
- Easy to customize
- Flexible and multi-purpose
- Valid / CSS3
- 24/7 Awesome support
- Detailed documentation

### What's Included

After purchasing Gratech template on themeforest.net with your Envato account, go to your Download page. You can choose to download Gratech template package which contains the following files:

#### The contents of the template package downloaded from ThemeForest

- Gratech - An React Template file. this file you ca edit and use for your business.
- Documentation - This folder contains what you are reading now :)

## React Installation

Please follow the instructions in the video to see how you can install react on your hosting:

1. For local host -
   1. Open you command prompt
   2. npm
   3. npm install or npm install--legacy-peer-deps
   4. npm run dev (will start the dev server at http://loaclhost:3000)
2. Deploying to Netlify - https://www.youtube.com/watch?v=TbQ4kWX29lQ

1. For locally build -
   1. Open you command prompt
   2. yarn build (will build locally and generate public directory)
   3. yarn start (will start the locally build server at http://loaclhost:3000)
2. Deploying to Vercel - https://www.youtube.com/watch?v=_8wkKL0LKks

##### Other Scripts

1. Open you command prompt
2. yarn lint:fix (This will format your code and fix auto fixable eslint error)

## Basic Site Settings

### Change Site Title, Favicon and Page Title

To change your Site title and Favicon open the Gratech in your editor and go to the location by following screenshot which are given bellow.

You can change title here
You can change page title here
You can change favicon here

### Change Logo

To change logo and customize other header data do the following:

You can change logo here

### Customize Menu

To customize menu do the following:

1. From the project folder go to src data menu-data Open the menu you want to use
2. Then customize the menu

Customize the menu

### Customize Footer

To customize footer data do the following:

1. From the project folder go to layout footers footer Open the menu you want to use
2. Then customize the footer data

Customize the footer

### Customize Blog data

To customize blog data do the following:

1. From the project folder go to data blog-data Open the menu you want to use
2. Then customize the blog data

Customize the blog

### Customize Header

We gave you four header layout. you can modify the header markup there.

1. From the project folder go to layout headers header Open the menu you want to use
2. Then customize the blog data

Customize the header

### CSS

To change CSS and setting you can change by following this screenshot here.

1. From the project folder go to public assets scss style.scss Open the menu you want to use
2. Then customize the css data

Customize the css

### Support

If you face any issue please contact us at Support Ticket. We provide 15 hours real-time support for our customers.

Thank you for purchasing our template.