Ynex - Component Structure

File structure

YnexTS/
							├── public
							├── src
							|   ├── @spk/
							|   ├── assets/
							|   |   ├── css/
							|   |   ├── iconfonts
							|   |   ├── images
							|   |   ├── scss
							|   |   └── video
							|   ├── components/
							|   ├── container/
							|   ├── firebase/
							|   ├── pages/
							|   ├── redux/
							|   ├── contextapi/
							|   ├── index.scss
							|   ├── main.tsx
							|   └── vite-env.d.ts
							├── .eslintrc.json
							├── .gitignore
							├── index.html
							├── package.json
							├── postcss.config.js
							├── README.md
							├── tailwind.config.js
							├── tsconfig.json
							├── tsconfig.app.json
							├── tsconfig.node.json
							└── vite.config.ts
Folders Description
  • Ynex - React Typescript Tailwind Admin Dashboard Template / : Root template folder contain all react component(Structure page), css, scss, images and other files.
    • public/ : Vite has built-in support for serving static assets located in the public/ directory. For example, if you save a file in public/abc.txt, it will be served as-is at https://domain.com/abc.txt.
    • src/ : Contains all the source files for the template, including assets, components, and application logic.
      • assets/: Folder where you can place static assets such as images, CSS files, JSON data, etc., which will be copied directly to the build directory during the build process.
      • components/: Includes common components such as the header, sidebar, theme switcher, and footer, which are reused across the application.
      • container/: Contains components that manage the layout and structure of the page.
      • pages/: Contains layout components specific to different pages of the application.
      • @spk/: Contains reusable components that are shared across the project, promoting modularity and reducing duplication.
      • app.tsx: Defines the root module for the application, which is used by Vite to assemble and render the components. It typically contains the main component structure of the app.
      • main.tsx: Responsible for setting up routing and rendering the app. It defines how pages and components are displayed based on the URL.
      • index.html: The main HTML page served when someone visits the site. You usually won't need to edit it directly since Vite automatically includes the necessary TSX and CSS files when building the app.
      • package.json: NPM configuration file that lists all third-party packages your project uses. You can also define custom scripts here for building, testing, or running the project.
      • vite.config.ts: Configuration file for Vite, where you can define build options, plugins, and routing settings for the project.