Web-Based Note Taking App!
On Monday, September 9, 2019, I was giving a lab that required me to create a web-based app that will able to allow the user to take notes and save it on the web. I had to create a new repository (repo) on my Github site and clone it onto my local compute in other to add the document I was working on, into the folder and commit back onto the Github. I used Github's GUI desktop application for closing folders/file from Github and commenting and/or pushing it back to the site.
Screenshot of web app using Visual Code
The gray area is where the user will type his/her notes.
Explain how it works?
When the user goes on the website they will see a page, same as the one above. If the user wants to read the paragraph about this site they are free to. To fully use this site, the user has to type into the gray area. After that, if the user wants to save the text all they need do is click on the saveFile button, to save it unto the web.
If this something already saved from previous use, this promotes will appear to alert the user,
After the promote the grayed out area will be populated with the previous text.
When the Remove text button has clicked; all text in the grayed area will be removed.
When the saveFile button is clecked or hotkeys "cmd+a" or "crl+a" are used a promote will appear stating that text has been saved.
Which extra feature(s) I added?
The features that I added to the web add is to include, google fonts, hotkey functionality, CSS manipulations, and Paper CSS. The google font allowed the text that appeared on the like different from the default, but when I added the paper CSS, all the text changed to compliement the paper CSS layout. The hotkeys was another addition to help the user save what he/she has written without clicking the saveFile button. The instructions on how to use it are in the paragraph, right before the designated text area.To Look at the HTML code and understand it: Github.
To try the Web-based Note taking app: Micro-note
Comments
Post a Comment