EcomArts Next - Multipurpose Ecommerce
NextJS Template
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
EcomArts Next -
Multipurpose Ecommerce NextJS Template
Getting started
Industri is a modern Responsive
Multi-Purpose Multi-Page bootstrap 5
template.
Template Features
NextJs & ReactJs
TypeScript
Bootstrap v5.x
Font-awesome
Custom Icon
07 Awesome Homepages
25+ Different Pages
Responsive Design
Pixel Perfect Design
Clean Code & Unique Design
Easy to Customize
W3C Validated Codes
What's Included
After purchasing Industry template on
themeforest.net with your Envato account, go
to your Download page. You can choose to
download Industri template package which
contains the following files:
The contents of the template package
downloaded from ThemeForest
main-file - This
folder contains the main files of the
template in NextJS, ReactJS, and
TypeScript.
documentation - This
folder contains what you are reading
now 🙂
All the pages are located in the
`/src/app/*` folder. You can use it easily
on your own purpose.
Pages Structure
Components Structure
The project is used components for spite
code, avoid code complexity and easy to
maintain. All the components are located in
the `/src/components/*` folder. You can use
it easily on your own purpose.
Components Structure
SCSS - Styling Files
The project is used SCSS for styling. All
the SCSS files are located in the
`/src/scss/*` folder. Modify the SCSS files
to change the UI.
SCSS Files
lib - Library Files
All the demo data and necessary files are
located in the `/src/utils/*` folder. You
can modify the files and folder if you want
to change the demo data.
After installing NodeJs, you can check the
version of NodeJs by running the following
command in your terminal.
Package Install
You have to install necessary package
through npm from `package.json`
Check you environment is ready to run
Install Packages
You have to run the following command to
install the packages.
npm run install
After complete the install process you can
run the project as `development` or
`production` mode
Run Development Server
You run development server for test, debug,
development or etc. But do not run the
development server as production.
Run Command
Check server running
You have to run the following command to run
the development server.
npm run dev
If all are set correctly, you will see the
following message in your terminal.
> npm run dev
$ next dev --turbopack
â–² Next.js 15.1.3 (Turbopack)
- Local: http://localhost:3000
- Network: http://192.168.68.110:3000
✓ Starting...
✓ Compiled in 487ms
✓ Ready in 2.9s
Run Production Server
If you want to run production server, you
have build the application first. Then you
can run the production server.
Run Command build command
Run Server
Check server running
You have to run the following command to
production build.
npm run build
If all are set correctly, you will see the
following message in your terminal.
Carefully collect the source name of
the image (i.e. hero.jpg)
Open the file called images.
Find the particular image file.
Replace the file with your image.
Make sure that the file name does not
change.The file name should be the
same.
Example:
Suppose you want to change the following
image file:
You have to do the following to change this
image with your own image:
Open the file called images.
Find the particular image file called
banner-img.jpg
Replace the file with your image
Make sure that the file name does not
change.
Note
Images seen in the live preview are
only set for preview purposes. They
are not included in the download
files.
Changing Brand Logo
To change any images of the website
Carefully collect the source name of
the image (i.e. banner-img.jpg)
Open the file called images.
Find the particular image file.
Replace the file with your image.
Make sure that the file name does not
change.The file name should be the
same.
Example:
Suppose you want to change the following
image file for change your logo:
Changing Colors
We have used
scss
for this project to write css. If you are
familiar with
scss
you should customize only the
.scss
files. Please make sure you compile the
main.scss
file after you have made changes in any of
the
.scss
files.
