/PWA-Text-Editor

I embarked on the exciting journey of creating a remarkable project as part of this course, and I can proudly say that this endeavor truly showcases my growth and understanding of the concepts I've learned thus far. The task at hand was to develop a browser-based text editor that would leave a lasting impression on potential employers.

Primary LanguageJavaScriptMIT LicenseMIT

PWA-Text-Editor

Table of Contents

Introduction

I embarked on the exciting journey of creating a remarkable project as part of this course, and I can proudly say that this endeavor truly showcases my growth and understanding of the concepts I've learned thus far.

The task at hand was to develop a browser-based text editor that would leave a lasting impression on potential employers. Not only did it have to be a single-page application meeting the Progressive Web App (PWA) criteria, but it also needed to incorporate various data persistence techniques to ensure redundancy and offline functionality.

To tackle this challenge, I decided to start with an existing application as the foundation and enhance it with my own implementations. The first step was to integrate methods for fetching and storing data to an IndexedDB database, a robust storage solution available within modern browsers. To simplify this process, I utilized a powerful package called idb, which served as a lightweight wrapper around the IndexedDB API.

The idb package proved to be an invaluable asset, as it offered a plethora of convenient methods for managing data within the IndexedDB database. Its reputation as a preferred choice for renowned companies like Google and Mozilla reassured me that I was utilizing a reliable and well-supported solution.

By leveraging the capabilities of idb, I was able to effortlessly store and retrieve data, ensuring a seamless and efficient experience for users. Whether they were creating new documents, editing existing ones, or accessing their work offline, this text editor provided a robust and reliable solution.

Throughout the development process, I constantly pushed my boundaries and applied the knowledge I had gained from the course. The result is a text editor that not only meets the desired requirements but also demonstrates my ability to tackle complex tasks and deliver exceptional results.

I am incredibly proud of the progress I have made and the accomplishments I have achieved with this text editor project. It serves as a testament to my dedication, perseverance, and the valuable skills I have acquired throughout my journey in this course.


Key Features

Browser-Based: The text editor runs entirely within the browser, eliminating the need for any installation or external software. Users can access it conveniently from any device with a compatible web browser.

Single-Page Application (SPA): The text editor is designed as a single-page application, ensuring a seamless and fluid user experience. Users can navigate through various sections and perform actions without the need for page reloads, resulting in a faster and more interactive interface.

Progressive Web App (PWA) Compatibility: The text editor meets the criteria of a Progressive Web App, enabling users to install it on their devices for quick access, similar to a native app. This feature enhances usability, especially for frequent users who want to have the text editor readily available from their device's home screen.

Data Persistence: The text editor incorporates robust data persistence techniques to ensure that user data is securely stored and readily available. By leveraging the power of IndexedDB, the application seamlessly stores and retrieves data, providing a reliable and consistent experience.

Offline Functionality: One of the standout features of the text editor is its ability to function offline. Users can continue working on their documents even without an active internet connection. The application efficiently caches data and synchronizes changes once a connection is reestablished, offering uninterrupted productivity.

Lightweight Wrapper (idb): The text editor utilizes the idb package, a lightweight wrapper around the IndexedDB API, to simplify data management tasks. This package provides a range of methods specifically designed for storing and retrieving data, ensuring efficient and streamlined interactions with the IndexedDB database.

Industry-Backed Solution: The choice of using idb as the data persistence solution is supported by industry giants such as Google and Mozilla. This ensures that the text editor leverages a reliable and well-maintained solution, offering users a high-quality experience.


Languages and Technologies Used

Socials

Featured Technology Used Link
JavaScript LINK
Node.js LINK
Git LINK
NPM LINK
Express LINK
dotenv LINK

Developers

Collaborators Socials
Noah Hoang Socials Socials Socials

 

Application Preview


Installation:

To Clone My Repository Using CLI

  1. Click on the green code button and copy the link for the SSH key.
  2. Once clip-boarded load up a command line interface and change directory to one of your preference
  3. Enter in the command git@github.com:CodeNameNoah/PWA-Text-Editor.git
  4. Enter your protected SSH password

To Download My Repository as a ZIP File

  1. Click on the green code button
  2. In the bottom of the drop-down menu, click Download Zip

github

Getting Started

To begin the installation process, first clone the GitHub Repository onto your local machine. After successfully cloning, open the root folder using the terminal. Execute the command "npm i" to install all the necessary modules and packages. Once the installation is finished, run "npm run start" to start the server and commence the operation.


Credits


License:

MIT License

Copyright (c) [2023] Noah Hoang

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,