Skip to content

An attempt to create a classic bulletin board in a web-browser. Using Django, Python, JavaScript and jQuery. Offers option to use a personal background, a personal board and team view board.

Notifications You must be signed in to change notification settings

MrJanHorak/sticky-note-bulletin-board

Repository files navigation

Sticky Note Bulletin Board

Background:

Addressing common everyday issues and using technology to be an assisting tool in helping life run a bit more smoothly has always been intriguing to me. One common issue I personally encounter is trying to find the best place to leave a quick reminder about something, and how to share them with those who need to see the quick information bits and reminders.

This is where this project founds it origin. What I wanted was a simple, as close to real life solution for posting notes my family could see.

Sticky-Note-Bulletin-Board finds inspiration in real life, it is targeted for larger screens: smartboards, Smart-TVs, or other digital displays. This app could be used as schools, businesses, clubs, public offices, and homes.

Sticky-Note-Bulletin-Board allows user personalization and has the option to share notes to a team-view screen (or family view). Each user can also determine their own layout and background texture by adding a URL in the profile settings, enabling a personal touch.

Users can create, update, and delete notes, even add pictures, and place the notes anywhere on the board. There are even widgets users can choose to activate and place on their personal views. Currently there is a calendar and a weather widget, other widgets are possible with an easy adaptation of the code.

Visit the app:

https://stickynotebullitenboard.fly.dev/

Screenshots

Technologies Used

  • Python
  • CSS
  • HTML
  • JavaScript/jQuery
  • Django
  • SQL

Next Steps

Track my progress on Trello:

https://trello.com/b/Io9nh33P/unit-3-project

Wireframes

https://wireframe.cc/lqXuvO

https://wireframe.cc/Ku86V0

https://wireframe.cc/J8ThBD

https://wireframe.cc/uIgD8s

ERD

Ice Box

  • re-sortable to-do list
  • style CSS according to note type (photocard/flashcard)
  • e-mail reminders of items due that day/week/month
  • dynamic brightening of note color
  • add a news/headline widget
  • weather based upon user profile city selection
  • font selection for notes
  • font color selection for notes
  • more mobile friendly options
  • ability to add app from a helper app on the phone so you can see the note when you get back home/ to the office etc.

Credits

jQuery Draggable library: https://api.jqueryui.com/draggable/ HEX Colors: https://www.color-hex.com/color-names.html Google Fonts: https://fonts.google.com/specimen/Architects+Daughter

License: These fonts are licensed under the Open Font License. You can use them freely in your products & projects - print or digital, commercial or otherwise. This isn't legal advice, please consider consulting a lawyer and see the full license for all details.

Nav Bar Picture: sticky note png: Sticky png from pngtree.com/

CSS Button design adapted from: https://getcssscan.com/css-buttons-examples

Weather Widget: https://weatherwidget.io/

Background Textures used for personal user settings are from: https://background-tiles.com

Random Sticky-Note rotation inspired by and adapted from: https://tympanus.net/codrops/2010/02/24/grungy-random-rotation-menu-with-jquery-and-css3/

MCDatepicker:https://mcdatepicker.netlify.app/

And a shout out to the many others who left code-tidbits here and there is random forums, blogs and stackoverflow handling the many issues one runs into while developing an app.

All items used with general permission for personal use only.

About

An attempt to create a classic bulletin board in a web-browser. Using Django, Python, JavaScript and jQuery. Offers option to use a personal background, a personal board and team view board.

Topics

Resources

Stars

Watchers

Forks