diff --git a/README.md b/README.md index 18c723c..304817e 100644 --- a/README.md +++ b/README.md @@ -29,18 +29,14 @@ My personal go-to boilerplate for most frontend projects using the React Library for client-side routing. - React Testing Library + Vitest + React Testing Library for testing UI components - i118 + i18n for internationalization - - - Redux - for handling state management @@ -57,6 +53,10 @@ My personal go-to boilerplate for most frontend projects using the React Library Framer Motion for animating + + Sanity + for content management + ## How to run the project: @@ -67,12 +67,18 @@ My personal go-to boilerplate for most frontend projects using the React Library npm install ``` -**Run the dev server** +**Run the dev server:** ```bash npm run dev ``` +**Run test:** + +```bash +npm run test +``` + ### Status 🟢 In progress... diff --git a/src/components/README.md b/src/components/README.md new file mode 100644 index 0000000..683af4e --- /dev/null +++ b/src/components/README.md @@ -0,0 +1,9 @@ +# Components Folder + +This folder holds all the components used in building an application. + +**/ui:** + +In this folder, we can further group UI primitives into a seperate folder called **ui**. Basically, a UI primitive is a small standalone component that is not made of other components. + +Other general components can live directly in the components root folder. A general component in this case will be components that are made up of other components. diff --git a/src/hooks/README.md b/src/hooks/README.md new file mode 100644 index 0000000..3a120cc --- /dev/null +++ b/src/hooks/README.md @@ -0,0 +1,8 @@ +# Hooks Folder + +This folder holds all the custom hooks defined in a React application. It is Reacts' best practice to extract a logic in a custom hook component that can be used anywhere in an application. + +**For example:** + +- useData.s +- useDebounce.ts diff --git a/src/pages/README.md b/src/pages/README.md new file mode 100644 index 0000000..d0fd81d --- /dev/null +++ b/src/pages/README.md @@ -0,0 +1,14 @@ +# Pages Folder + +This folder is where all the **root level pages** a user can navigate to will live. + +It defines the entire **structure** or **skeleton** of an application and how a user can navigate through it. + +**For example:** + +- Home Page +- About Page +- Dashboard Page +- Login Page + +**NB:** You can customize this folder in any way you deem it fit for the application you are building. There is no one fit solution. diff --git a/src/services/README.md b/src/services/README.md new file mode 100644 index 0000000..01a636e --- /dev/null +++ b/src/services/README.md @@ -0,0 +1,10 @@ +# Services Folder + +This folder holds any type of service an application might consume: + +For example: + +- **/api**: fetching an api endpoint +- **/i18n**: implementing different languages within an application +- **/state**: handling global state +- **/providers**: for any shared data(mostly context) that can be wrapped around the root component of an application. In other words, any sort of provider an app might use. diff --git a/src/styles/README.md b/src/styles/README.md new file mode 100644 index 0000000..e1ddd62 --- /dev/null +++ b/src/styles/README.md @@ -0,0 +1,3 @@ +# Styles Folder + +This folder holds all the global styling that an application needs. diff --git a/src/utils/README.md b/src/utils/README.md new file mode 100644 index 0000000..df61093 --- /dev/null +++ b/src/utils/README.md @@ -0,0 +1,5 @@ +# Utils Folder + +This folder holds any piece of functionality that is small but very useful and doesn't fit anywhere within an application(folder). + +For example, helper functions.