Folder Structure
DASHTIC/
├── node_modules
├── public
├── src/
| ├── assets
| | ├── css
| | ├── images
| | ├── plugins
| | ├── scss
| | └── switcher
| ├── Auth
| ├── Components
| ├── Firebase
| ├── Redux
| ├── Shared
| ├── .env
| ├── Index.scss
| └── main.jsx
├── .gitignore
├── gulpfile.js
├── index.html
├── package-lock.json
├── package.json
└── vite.config.js
# |
File |
Purpose |
|
node_modules |
Node.js creates this folder and puts all third party modules listed in
package.json inside of it. |
|
public |
Vite has built-in support for serving static assets living in the public/ directory. For example, if we save a file in public/abc.txt , then it will be served us as-is at https://domain.com/abc.txt . |
|
assets |
A folder where you can put images, css, json data anything else to be
copied wholesale when you build your application. |
|
App.jsx |
Defines AppModule, the root module that tells vite-react how to assemble the
application. Right now it declares only the AppComponent. Soon there
will be more components to declare.
To navigate the file the path is here : (src/shared/Layout/App.jsx) |
|
.env |
. env file contains the individual user environment variables that override the variables set in the /etc/environment file. You can customize your environment variables as desired by modifying your .env file |
|
index.scss |
Global Sss/Scss code. |
|
main.jsx |
Routing basically means navigating between pages. You have seen many
sites with links that direct you to a new page. This can be achieved
using routing. |
|
.gitignore |
Git configuration to make sure autogenerated files are not commited to
source control. |
|
gulpfile.js |
Gulp is a task runner that uses Node. js as a platform. Gulp purely uses the JavaScript code and helps to run front-end tasks and large-scale web applications. It builds system automated tasks like CSS and HTML minification, concatenating library files, and compiling the SASS files. |
|
index.html |
The main page that is served when someone visits your site. Most of
the time you'll never need to edit it.
The CLI automatically adds all tsx and css files when building your app
so you never need to add any
<script> or <link> tags here
manually.
|
|
package-lock.json |
The goal of package-lock. json file is to keep track of the exact
version of every package that is installed so that a product is 100%
reproducible in the same way even if packages are updated by their
maintainers. This solves a very specific problem that package. |
|
package.json |
npm configuration listing the third party packages your project uses.
You can also add your own custom scripts
here. |
|
vite.config.js |
the file vite.config.js is the stands for configuration management tools. and we mostly use for to configure the root routing path |