More Premium Hugo Themes Premium React Themes

Googlekeepclone

A clone of Google Keep with its original Material Design aesthetics

Googlekeepclone

A clone of Google Keep with its original Material Design aesthetics

Author Avatar Theme by anselm94
Github Stars Github Stars: 570
Last Commit Last Commit: Apr 17, 2021 -
First Commit Created: Jan 15, 2024 -
Googlekeepclone screenshot

Overview:

This product is a clone of Google Keep, written in ReactJS with Material UI components. It aims to mimic the design and features of Google Keep, with additional functionalities like sharing, archiving, reminders, etc. The backend is implemented using a GraphQL server written in Golang, with data persisted in an SQLite DB file. Authentication is implemented using Cookie based Authentication with Authboss. The product also offers a light and dark theme.

Features:

  • Login & Register for creating a new user
  • Colors, Sizes, Margins, Paddings, etc., matches exactly that of Google Keep’s Web App
  • Responsive Design - Adapts to all screen sizes from mobile screens up to 4k displays
  • Dark Mode - Dynamically change between light and dark theme
  • Notes - Create, Update, Copy, Delete items on the fly. Dynamically change between two modes: simple notes and todos with checkboxes
  • Colors - Assign colors to notes and adapt to dark/light theme
  • Display Mode - Notes can appear in the canvas in two different modes: List or Tile
  • Labels - Label your notes, assign/unassign labels dynamically, and filter notes by selected labels
  • Subscriptions - When notes are created/deleted in different browser tabs, the updates are pushed from the server to the client

Installation:

To install the theme, follow these steps:

  1. Clone the repository:
git clone [repository-url]
  1. Run the GraphQL server:
cd backend
go run main.go
  1. Run the ReactJS frontend:
cd frontend
npm install
npm start
  1. Open your browser and navigate to http://localhost:3000 to access the theme.

Summary:

This product is a Clone of Google Keep, implemented using ReactJS and Material UI components. It offers a range of features including login/register functionality, responsive design, dark mode, notes management, color assignment, display modes, labels, and subscriptions. The backend is implemented in Golang with GraphQL, and the theme can be installed by cloning the repository and running the server and frontend.