Git Product home page Git Product logo

checkedin.'s Introduction

checkedin.

Summary

checkedin. is an open source, browser-based CRUD application providing users with a minimalistic platform to manage their contacts and be reminded of when to get in touch with others.

Through the use of localstorage and DOM manipulation, and the Object Oriented Programming (OOP) paradigm, checkedin. enables users to submit a contact that are due for a check-in and, upon page-refresh, update each contact's daysLeft variable to indicate whether the check-in is due/past-due, and/or signal how many days are left between the check-in date and the current date of browser session.

To make the most out of checkedin. it is encouraged to bookmark the URL for ease of access, and to run it on a Chromium-based browser (e.g. Google Chrome, Microsoft Edge, or Brave) for optimal user experience.

Live Demo & Source Code

Technologies

checkedin. is built with HTML, CSS, JavaScript, Node.js, Day.js, and Web Browser APIs (localStorage).

(8/31/21): checkedin. is in the process of Google Firebase integration in order to enhance the portability and security of user data. (9/17/21): commits regarding the Firebase integration can be reviewed in the 'firebase-int' branch in the repository.

Demo

checkedin. dynamic demo

Directory Map

The repository is organised as the below tree structure:

root
│   contribute.md
│   LICENSE
│   package.json    
│   package-lock.json   
│   README.md 
│
└───public
│   │   demo.gif
│   │   demo.html
│   │   index.html
│   │   style.css
│   │   thumbnail.png
│
└───src
│   │   index.js
│   └───components
│       │   contact.js
│       │   modal.js
│       │   profile.js
│
└───lib
│   │   dayjs.min.js
│
└───changelog (*)
│   │   ...
│

(*): visual representation of UI/UX iterations (files are numerated for coherence)

Contributions

Open source contributions are always welcome.
Current list of contribution opportunities can be found at root/contribute.md.

contribute.md

FAQ

Why does the user submit the contact's last initial, instead of last name?

The currently deployed application is an MVP and functions entirely on client's browser, through the use of the Web Storage API.

This means that all of the CRUD (Create, Read, Update, and Delete) activity is stored within localStorage, for which the author cannot guarantee its security as he can for a designated server-side DB.

The author believes that the use of localStorage in this manner was a strategic decision that offers a great trade-off for speedy deployment and rapid prototyping.

Last initial was used, in lieu of last name, in order to provide a layer of anonymity for the user given the inherent security risk with localStorage.

Where can I see the notes I've included with a contact?

Make sure to hover your mouse over the ↠notes↞ text to preview the note snippet that you've submitted!

What could be done to bolster the security of user data collected in localStorage?

The author is brainstorming ways to promote enhanced user privacy and, as of Feb 4th, 2021, believes that the use of W3C's Web Cryptography API coupled with Google Firebase may be the first step towards the right direction.

Isn't this a redundant reiteration of a generic Calendar application?

In a way, checkedin. is similar to conventional online calendars in that it is a platform on which users can keep a record of their schedules and store it on their electronic devices.

However, the area whereby checkedin. excels is the layer of minimalism that is applied to the existing calendar concept, resulting in a more intuitive UX.

Compared to other calendar applications whereby the user may get lost amidst the wide variety of recorded events & multiple synced accounts, checkedin. is easy to navigate and allows the user to regain control of their schedule through its user-centric UI.

Would the author be open to adding a reminder functionality, perhaps in the form of push-notifications, etc?

With checkedin.'s guiding philosophies of user-centricity and minimalism, the author intends for the application to not have any notifying features that would remind the user at calculated intervals.

This is because the author believes the user should claim full agency with regards to their use of checkedin., not the other way round whereby the application dictates the user and make them become dependent to technology such as this one.

While online and electronic in its very nature, checkedin. can be approached the same way an offline medium would be used; the user picks up the platform when-- and only when-- they feel obliged to do so.

Will checkedin. become a native mobile application?

Given the heightened level of isolation and disconnectedness brought about by the ongoing pandemic, the author remains convinced that a designated platform like checkedin. may serve a tangible purpose to users and be of practical use for many, not just for those within the author's network.

With that said, the author is open to scaling the application upon peer feedback and back end configuration.

As of current, checkedin. is being developed into a mobile-responsive application available on mobile browsers although the possibility of mobile-native development is yet to be decided.

How can I provide user-feedback and/or contribute?

As a BSD-3 licensed open source application, the author would be grateful for any feedback regarding checkedin.'s UX. Furthermore, any developer contribution is especially welcome given the author's growing (yet limited) knowledge of software development.

Please direct all feedback via email and kindly submit a Pull Request for developer contribution opportunities.

checkedin.'s People

Contributors

thejyc avatar

Stargazers

 avatar

Watchers

 avatar

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.