SmartNotes is a front-end application developed with ReactJS, designed to simplify note-taking using both text and voice input. This application blends modern technologies to deliver an intuitive, responsive, and highly practical user interface.
- Add or edit notes using voice or keyboard input.
- Responsive interface built with TailwindCSS.
- Data persistence enabled via Web Storage APIs.
- Support for SpeechRecognitionAPI, enabling voice-to-text note-taking functionality.
SmartNotes demonstrates fundamental React concepts, such as properties, state, and components. It follows best practices by employing TypeScript, ensuring robust, type-safe, and maintainable code.
This project was developed using the following tools and technologies:
- React — JavaScript library for building user interfaces.
- TypeScript — Statically-typed superset of JavaScript for better code quality and safety.
- Vite — Fast and efficient development environment.
- TailwindCSS — Utility-first CSS framework for rapid and responsive styling.
- Radix UI — Accessible and customisable UI components.
- SpeechRecognitionAPI — Voice recognition API for voice input functionality.
- Sonner — Notification system for user feedback.
- Web Storage API — Browser-based storage for local data persistence.
Follow the steps below to set up and run the project on your local machine:
- Ensure that you have Node.js and npm installed.
- Clone the repository by running the following command in your terminal:
git clone https://github.com/patriciasegantine/smart-notes.git- Navigate to the project directory:
cd smart-notes- Install the required dependencies:
npm install- Start the development server:
npm run dev- The project will be available in your browser at:
http://localhost:4000.
To create an optimised production build, execute the following command:
- Run:
npm run build- The optimised production build will be located in the
distdirectory, ready for deployment to any static hosting service.
You can see a live preview of the application by clicking the link below:
Contributions are welcome! Feel free to submit pull requests or open issues if you encounter any problems or have suggestions for improvement. 😊
How to contribute:
- Fork the repository.
- Create a branch for your feature or fix:
git checkout -b my-feature- Make your changes and commit them.
- Push the changes to your fork:
git push origin my-feature- Open a pull request describing your changes.
This project is licensed under the MIT Licence.
Created with ❤️ by Patricia Segantine