Codesign
Codesign Architecture & Interior NextJs Template
Thank you for purchasing this NextJs template.
Package Installation & Setup -
1.- Install npm
It will create 'node_module' folder in this all dependency files will be install with this command
npm install
2.- Run Project
With is command file will be compiled and it will be loaded on local server `http://localhost:5173/
npm run dev
3.- Production Build
You may run npm run build command to build the app.
npm run build
4.- Deploying your site
For More details Click
5.- Note:
To get more help on the TypeScript checkout TypeScript
6.- Further help
You can learn more in the Create React TypeScript Application Documentation To learn TypeScript, check out the TypeScript Documentation.
Folder Directories -
-
package.json
All dependencies
-
public
Static assets to be served
-
src/assets
This folder contains all the assets of Codesign template.
-
src/app/component
This folder component files for various template features.
-
src/app/elements
This folder contains all the elements files of Codesign template.
-
src/app
This folder has all pages components for various template features.
-
src/asstes/images
This folder has all images form used in the template.
-
src/assets/css
Css file
Files -
- package
- src
- assets
- app
- components
- elements
- page-name
- page.tsx
- page.tsx
- layout.tsx
- package.json
- package-lock.json
- src
Theme Features -
Color Theme
Choosing a color theme for a website is an important part of creating a visually appealing and effective design. Here are so many color option available, you can choose a color theme for your website.
<body data-color="color_1">
Layout Mode
Choosing a layout mode for a website is an important part of creating a visually appealing and effective design. Here are so many mode option available, you can choose a layout mode for your website.
<body class="layout-light">
<body class="layout-dark">
Header
The header of a website is the top section of the site that appears on every page. It typically includes the website logo, navigation menu, and sometimes additional elements such as a search bar, social media icons, or a call to action. Here we used fixed and sticky header in our website-
Header Fixed is-fixed
<div class="main-bar-wraper navbar-expand-lg sticky-header is-fixed">
Header Static sticky-no
<div class="main-bar-wraper navbar-expand-lg sticky-no">
Project Main Features -
- Next.js 14.1.0
- TypeScript v5
- ReactJS v18
- Node v20.10.0
- npm -v 10.2.3
- 5+ Home page
- Dark Layout
- Fully Responsive
- Detailed Documentation
- Swiper Slider -v 11.0.6
- Contact Us
- Advanced Elements
- Under Maintenance
- Coming Soon Page
- Error 404
- Countup
- Key Feature
- Blog Page
- Faq
- Menu Style
- Team Page
- Shop Page
- Services
Credits -
-
Next.js
-
EmailJS
-
TypeScript
-
CountUp
-
Modal Video
-
lightGallery
-
Swiper Slider
-
Framer Motion
Main Page -
layout.tsx
import '../assets/css/style.css'
export default function RootLayout({children}: Readonly<{children: React.ReactNode;}>) {
return (
<body>
<main>
{children}
</main>
</body>
);
}
Demo Page -
src/app/blank/page.tsx
const Blankpage = () => {
return (
<div>
<h5>
This is empty page
</h5>
</div>
);
}
Our Products -
Do You Need Help To Customization
After Purchase A Template...
You Will Start Customizing According Your Requirement
BUT What If You Don't Know
SOLUTION IS HIRE DexignZone
Hire Same Team For Quality Customization
- In Order To Ensure Your Website Is Live, We Will Customize
- The Template According To Your Requirements And Upload It to the Server.