Code Monkey home page Code Monkey logo

chrome-react-extension's Introduction

Nocrastinator

Overview

Nocrastinator is built with React.js and allows users to block distracting websites to help improve productivity and focus. Users can toggle the blocker on and off for all websites or individual websites. The extension also supports adding custom websites for blocking.


Website Blocker V1

Features

  • Toggle blocking for all websites with a master switch.
  • Toggle blocking for individual websites.
  • Add and remove custom websites for blocking.
  • Custom website names for easy identification.
  • Intuitive and user-friendly interface.

Usage

  1. Click on the extension icon in the Chrome toolbar to open the popup interface.
  2. Use the master switch to block or unblock all websites.
  3. Toggle individual websites using the provided switches.
  4. Add custom websites:
    • Enter the URL and the website name in the provided fields.
    • Click "Add Website" to add it to the list of blocked websites.
  5. The extension will automatically block the specified websites when they are accessed.

Custom New Tab V1

Features

  • Clock: Displays the current time with theme-based styling.
  • Weather App: Provides current weather updates based on the user's location.
  • Greeting: Shows a greeting message that changes based on the time of day.
  • Quick Links: Allows users to access frequently visited websites quickly.
  • Quote Display: (Coming Soon) Displays a motivational quote each day.
  • Daily Word: Displays a word of the day with an example sentence to expand your vocabulary.
  • Theme Toggle: Switch between light and dark themes.

Usage

  • Once Nocrastinator is loaded, there should be a prompt by Chrome asking you if you want Nocrastinator to replace your default new tab page. Click Yes. You can always turn it back off at chrome://extensions/ if you want to revert back to the old new tab page.

Installation (Chrome)

  • Nocrasinator is in the process of being published on the Chrome Web Store: Stay Tuned!

Installation (Local)

  1. Clone or download this repository to your local machine.
  2. Open Chrome and navigate to chrome://extensions/.
  3. Enable "Developer mode" by clicking the toggle switch in the top right corner.
  4. Click on the "Load unpacked" button and select the directory where you downloaded or cloned this repository.
  5. The extension should now appear in your list of installed extensions.

Contributing

Contributions are welcome! Please follow these steps to contribute:

  1. Fork this repository.
  2. Create a new branch (git checkout -b feature-branch).
  3. Make your changes.
  4. Commit your changes (git commit -m 'Add some feature').
  5. Push to the branch (git push origin feature-branch).
  6. Open a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgements

  • Special thanks to all contributors and peers for their feedback and support.
  • Special thanks to my advisor and experts who have helped: Ms. Verma, Ms. Tulin.

Contact

If you have any questions or feedback, feel free to open an issue.


Changelog


Thank you for using Nocrastinator! We hope it helps you stay focused and productive.

chrome-react-extension's People

Contributors

zeendabean24 avatar

Stargazers

 avatar

Watchers

 avatar

chrome-react-extension's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.