GOOGLE CLONE - ALIGHT

Alight-Coding-Challenge

Technologies used

• React Js
• Tailwind (css)
• Axios (data fetching)

Steps to run the project.

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm run build

Builds the app for production to the build folder.

Code Structure

src/: Contains the source code.

• assets/: contains media and styling related files.
• components/: contains react components that are reusable in different parts of the app.
• constants/: this contains the reusable constant variables.
• hooks/: this contains the reusable hooks.
• pages/: contains the components that are used web pages of the app.
• types/: contains types or interfaces files.
• App.tsx: the wrapper of the whole application, where we can do routing, or any other functionality which applies to whole application.
• index.tsx: the overall configuration file of the app.
• craco.config.js: the helps to override the webpack configuration.
• tailwind.config.js: configuration file for tailwind css.

Additional Features or Considerations

• Dark mode and light mode toggling
• Autodetect user's country

NOTE: all the data used on this application are from external API, which may have unexpected issues, so please trust me it works 😊