I just took my first steps into the open source world and it was amazing. As my first project, I built a note taking application with the help of some open source projects and Github. I’m going to admit, I was a bit scared at first because I hadn’t touched web development in months so I was I rusty in Javascript and other web technologies. Thanks to my instructor, I was able to set-up everything on Github with ease and execute git commands that I had forgotten. All in all it was a good experience and was nice to get back into coding after a long break from it.
Whiteboard Application
The point of this application is to allow users to takes
notes on a webpage. There are also features such as saving what you have
written on the whiteboard or clearing the whiteboard all at once. The
application was built using the following open source projects:
- · Filer
- · PaperCSS
- · Hotkeys
FilerJS Browser Filersystem library allowed us to read and
write to files with a given file path. This was really helpful as it allowed me
to add the functionality of saving the notes and continuing them during a later
time.
PaperCSS was used mostly to for UI. The fonts and the
background was given a hand-drawn, paper sketch feeling giving the user an authentic
feeling of taking note.
HotKeys helped me with taking user keyboard input. With this
I was able to create custom shortcuts for saving and cleaning functionality.
Technology
Working on this project i learned many things but the thing that stuck out most to me was contenteditable. Contenteditable is an attribute that can be added to any HTML element. When added, the element becomes editable. To me this is a very interesting feature and will be making use of it with other projects.Links
Github Repo
Whiteboard Application
Comments
Post a Comment