Top

Let's begin

Thank you for buying the Cion admin template

Main dependancies
  • React 19.0.0
  • Bootstrap 5.3.3
  • Typescript 4.9.5
  • Scss

Cion React Admin Theme is pure React theme, Yes! you read correct, it's No Jquery React admin theme including all feature and functionality with ease of integration for your project. Cion theme documentaition will help you to understand React from scratch for making your own perfect real time dream application.


Cion Admin is a responsive React template that is based on the CSS framework Bootstrap 5 and it is built with Sass. Sass compiler makes it easier to code and customize. If you are unfamiliar with Bootstrap, visit their website and read through the documentation. All of Bootstrap components have been modified to fit the style of Cion Admin and provide a consistent look throughout the template.


Before you start working with the template, we suggest you go through the pages that are bundled with the theme. Most of the template example pages contain quick tips on how to create or use a component which can be really helpful when you need to create something on the fly.

Prerequisites

Before you begin, make sure your development environment includes Node and an npm package manager.

1.Node.js

Install Node.js using downloaded file.

To check your node version, run node -v in a terminal/console window.

2.Npm package manager

CLI (command line interface), and React apps depend on features and functionality provided by libraries that are available as npm packages. To download and install npm packages, you must have an npm package manager.

This Quick Start uses the npm client command line interface, which is installed with Node.js by default. To check that you have the npm client installed, run npm -v in a terminal/console window.

For better understanding React we suggest you to once go through official documentation of React from anodejs.org.

React setup

Create Initial application

Run the npm command create-react-app and provide the name my-app, as shown here:

npx create-react-app@latest

The create-react-app command prompts you for information about features to include in the initial app project. Accept the defaults by pressing the Enter or Return key.

Serve Application

Go to the workspace folder (my-app).

cd my-app

Launch the server by using the npm command npm start

npm start

Build Application

Build you application for host on server using below command:
npm run build

It will create one dist file in your theme folder. Make zip of dist folder. so here you are ready to upload your theme on server.

If you’re using Apache HTTP Server, you need to create a .htaccess file in the public folder by pastng below code

  • Options -MultiViews
  • RewriteEngine On
  • RewriteCond %{REQUEST_FILENAME} !-f
  • RewriteRule ^ index.html [QSA,L]

Now upload your dist folder on public folder

Cion setup

First, you must download and install node.js. NPM stands for node packaged modules and is a way to manage development dependencies through Node.js.

Download the Node.js source code or a pre-built installer for your platform, and start developing, you can download it from anodejs.org.

You can check it in your terminal window using these commands node --version and npm --version.

Cion Theme Setup

  • Download and extract an Cion themes from themeforest
  • Extract it and then go in to theme folder. cd theme
  • Import all dependency by installing npm command npm install
  • Now you are in stage to successfully run Cion using below command: npm start

NPM use the package.json file and automatically install the required local dependencies listed in it.