Skip to content

Rohit19060/bookmark-store

Repository files navigation

Bookmark Store

🌟 Bookmark Store 🌟

App for storing Bookmarks, it is utilizing thinkful list API

Bookmark Store License Bookmark Store Forks Bookmark Store Stars Bookmark Store Issues Bookmark Store Pull Requests Bookmark Store Repo Size Join discord community for Bookmark Store Open in VSCode

Bookmark Store

🌐 Links 🌐

📂 Repo · ✨ Live View · 🚀 Got Issue

🚀 Features

  • Simple and Minimal UI

  • Add Rating to Bookmark

  • Store Title, URL, and Description

  • Remove Bookmark

  • Filter Bookmark up to Rating

🦋 Prerequisite

  • Basic Understanding of HTML

  • Basic Understanding of CSS

  • Basic Understanding of JavaScript

  • Basic Understanding of webpack

  • Basic Understanding of Node

  • Basic Understanding of NPM

🛠️ Installation Steps

  1. Clone the repository
git clone https://github.com/Rohit19060/bookmark-store.git
  1. Change the working directory
cd bookmark-store
  1. Install Dependencies
npm i
  1. Run the app using terminal
npm start

🎇 You are Ready to Go!

❗ Available Commands

In the project directory using terminal, you can run:

npm start

This command will execute webpack serve --open chrome. This app is developed with Webpack so, It will launch the app using the Webpack server. Because the open chrome option passed with the command, it will also open the app in chrome. Runs the app in the serving mode. Open http://localhost:3000 to view it in any browser.

npm run build

This command will execute webpack. Builds the app for production to the docs folder. It correctly bundles all the files and assets in production mode and optimizes the build for the best performance. You can use any server to serve the app in production mode.

npm run dev

This command will execute webpack --watch. It is Webpack watch mode where the app gets compiled automatically whenever you make a change in the src files. You can use any server to serve the files. With the help of Live Server you can make your development process very fast.

👷 Built with

  • HTML: For Creating Markup

  • CSS: For Designing

  • JavaScript: For Writing, scripts to get the repos

  • Webpack: As module bundler. Webpack takes modules with dependencies and generates static assets representing those modules.

  • NPM: Package Manager

  • Node: JavaScript runtime

📂 Directory Structure

./src/index.html: Main entry file

./scr/**.js: All the script files(Modular approach)

./src/styles.css: Main Style file, Contain all the styles of the app

./docs/**.**: Production Directory

🎊 Future Updates

  • Reliable Storage

🧑🏻 Author

Rohit Jain

🤝 Support

🎀 Contributions (GitHub flow), 🔥 issues, and 🥮 feature requests are most welcome!

💙 If you like this project, Give it a ⭐ and Share it with friends!

💰 Donations Links

PayPal Buy me a Coffee Ko-fi Patreon

Made with JavaScript & ❤️ in India