Finsa - React Documentation

Finsa - React Consultancy & Business Template

In order to kickstart the development of your web src with Finsa, the very first thing is to setup an Angular development environment.

• Node.js and NPM : If NodeJS is not installed then download it from https://nodejs.org/. NPM comes bundled with Node.js

• Before proceding you'll need to install npm packages. You can do this by running npm install from the root of your project to install all the necessary dependencies.

• Run npm start for a dev server. Navigate to localhost:3000/. The src will autometically reload if you change any of the source files.

• Run npm run build to build the project. The build artifacts will be stored in the build/ directory. Use the run build flag for a production build.

• To get more help on the react use npm --help or go check out the React Support.

• Home Page 1 (/src/components/pages/Home)
• Home Page 2 (/src/components/pages/Hometwo)
• Home Page 3 (/src/components/pages/Homethree)
• About Us (/src/components/pages/About)
• Team (/src/components/pages/Team)
• Team Detail (/src/components/pages/Teamdetail)
• Blog Grid (/src/components/pages/Bloggrid)
• Blog Standard (/src/components/pages/Blogstandard)
• Blog Detail (/src/components/pages/Blogdetail)
• Portfolio (/src/components/pages/Portfolio)
• Portfolio 2 (/src/components/pages/Portfoliotwo)
• Portfolio Detail (/src/components/pages/Portfoliodetail)
• Service (/src/components/pages/Service)
• Service 2 (/src/components/pages/Servicetwo)
• Service Detail (/src/components/pages/Servicedetail)
• Shop (/src/components/pages/Shop)
• Shop Detail (/src/components/pages/Productdetail)
• FAQ's (/src/components/pages/Faq)
• Careers (/src/components/pages/Careers)
• Contact Us (/src/components/pages/Contact)

Template Features:

• Built on React 17.0.1
• Attractive Homepage
• Responsive in Any Device
• Retina Ready
• Creative and Beautiful Layout
• Fast, Lightweight & Powerful
• Smooth Transition Effects
• ES6+
• Clean And Professional Coding
• Creative and Modern Design
• Bootstrap (v4.5.0)
• Simple Client-side Routing (page based)
• Google Font and Icon Used
• Integrated With IcoFont and FlatIcon
• Easily Customizable
• Well Commented Code
• Detailed Documentation

Here are the dependencies list which being used in the Finsa React Template:

 
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "animate.css": "^4.1.1",
    "bootstrap": "^4.5.3",
    "classnames": "^2.2.6",
    "node-sass": "^4.14.1",
    "react": "^17.0.1",
    "react-bootstrap": "^1.3.0",
    "react-circular-progressbar": "^2.0.3",
    "react-countup": "^4.3.3",
    "react-dom": "^16.14.0",
    "react-isotope": "^1.0.7",
    "react-masonry-component": "^6.2.1",
    "react-meta-tags": "^0.7.4",
    "react-modal-video": "^1.2.6",
    "react-progressbar": "^15.4.1",
    "react-router-dom": "^5.2.0",
    "react-scripts": "3.4.3",
    "react-slick": "^0.27.11",
    "react-visibility-sensor": "^5.1.1",
    "react-wow": "^1.0.0",
    "slick-carousel": "^1.8.1"
  },

By default, the template loads Nunito and Source Sans Pro font from Google Web Font Services, you can change the font with the one that suits you best.

Font code can be found in the "assets/css/style.css" file:

<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;600;700;800;900&family=Source+Sans+Pro:ital,wght@0,600;0,700;0,900;1,400&display=swap" rel="stylesheet">