Cover image for Code-itยฎ Notes ๐Ÿ“  for JavaScript

Code-itยฎ Notes ๐Ÿ“ for JavaScript

danielharding profile image Dan Harding ใƒป2 min read

Everybody loves a Post-it note. For organising, taking messages, even project planning. Their versatility makes them perfect for tasks that only require bitesize pieces of information. They're big enough to scribble a few words on, but too small for more than a couple of sentences.

And it's no surprise that digital stickies have become a popular feature of notetaking apps too. Padlet, Google Jamboard and Trello all use their own versions. Breaking down big ideas into smaller, managable chunks makes the most difficult challenges somehow more achievable.

I prefer to study by taking detailed handwritten notes, but this makes finding specific reminders frustrating. Particularly when it comes to JavaScript. I revisit the same tutorials, each time taking notes, only to still have trouble remembering how different data types and methods work later on.

So to try and solve this problem, I've decided to combine the Post-it format with a consistent note taking style; Code-it notes!

Each note explains a single topic (e.g. a JavaScript method) in simple, non-jargon language, with an annotated example on the back. Every time I study something new, I'll create a note, share it online and steadily build a resource that will grow into a handy reference library. I'm starting with JavaScript (as that's what I need to revise most), but hope to cover HTML and CSS too.

If you'd like to use Code-it notes, I'll be sharing them via Instagram initially and building the collection as a Google Slides presentation. To get started, the first 3 have been embedded here on dev.to.

If you have any feedback, or would like to request a topic, I'd be interested to hear it! ๐Ÿ‘จโ€๐Ÿ’ป

Posted on by:

danielharding profile

Dan Harding


Learning technologist, designer and frontend developer who most enjoys learning whilst making.


markdown guide

Love this! What are you using to create those cards? If you put this on GitHub, we could contribute based on your specifications and build an amazing reference resource.


Thanks Phill! That's a great suggestion. I'm keeping it simple for now and designing the notes in Google Slides, but had wondered about coding them instead. I'll carry on experimenting and post back once I have something. Feedback appreciated. ๐Ÿ‘


Agree, I want to print my own javascript chart


Hi Aivan, I've been thinking about something like this. Once I've designed a few more notes, I'll look into alternative formats and templates for others to design their own. Thanks for your feedback. ๐Ÿ˜€


lovely execution, i had a similar idea when i wanted to talk functional programming to folks of different programming backgrounds because post-it notes or even flash cards provide just enough (if well done) to get people excited to learn more. keep them coming :)


Simple, concise, and effective. Put these on the web please.๐Ÿ™ They deserve their own site. ๐Ÿ’ฏ


This is fantastic! I could see these being used in a classroom as part of a review game in addition to individual study. Such a good idea, well designed. Cheers!


Thanks Anna! I work in education, so I'm starting to think about how the notes could be adapted into reusable teaching materials. I'll share back what I come up with. ๐Ÿ˜€


Hey the idea is amazing, will help a lot now that I'm trying to not become crazy with Elm. :)

Also keep the good work, for sure it will help many devs.


Great idea. These are very useful. Keep up the great work.


Awesome thanks for sharing! Keep them coming.


I am following the profile, awesome job, keep posting cause I turned on the notifications!


Thanks Diego, I'll try my best. ๐Ÿ‘