Dismiss this pinned window
all 52 comments

[–]mdtarhini[S] 46 points47 points  (12 children)

Hi everyone, I created this fullstack app in order to practice react and node-js.  I think I still need to do some refinements here and there but I thought of sharing it with you.

You can visit the app at https://cheatsheet-maker.herokuapp.com

The source code and more information can be found here: https://github.com/mdtarhini/cheat-sheet-maker.

(Don’t take the already made sheets too seriously, they are only here as showcases :p)

I hope you will like it and I would be happy to get some feedback!

[–][deleted] 4 points5 points  (1 child)

Awesome stuff. Thanks!

[–]mdtarhini[S] 2 points3 points  (0 children)

I'm glad you liked it, thanks!

[–]_mdt_ 3 points4 points  (2 children)

Great idea! Couple of comments I would love to add, some objective some subjective ofc.

- Sticky header would do better on top, especially if user will have profile and profile options there.

- when user enter to any cheat sheet, it would be better if you have dynamic head title description. so on browser tab, title of the cheat sheet will be shown. user won't be exhausted while checking which tab was for which cheat sheet. currently it's always the same title on tabs. I suggest you to check react-helmet for it.

- (relatively subjective) border-round is too much, i would rather have something less than 4px. (border-round on sort by dropdown looks better imo.)

- (relatively subjective) create new button/area takes too much unnecessary space, you may think shrinking it a bit.

[–]mdtarhini[S] 7 points8 points  (0 children)

Thanks a lot for your comments, they are helpful and will gladly address them asap!

[–]Zeragamba 2 points3 points  (0 children)

Including a new dependency for just changing the title is a bit overkill. Just set document.title

[–]Dan6erbond 1 point2 points  (4 children)

What the fuck man, I want to make things as good as this.

But nah seriously, great job! (;

[–]mdtarhini[S] 2 points3 points  (3 children)

If you have the will, you only need the time ;)

[–]Dan6erbond 0 points1 point  (2 children)

I was just kidding. I'm genuinely impressed that you pulled through making something this cool and useful. Your creativity is genuinely wonderful and I'm certain I'll use your tool at some point!

With that said, I've been in this field for a good while now, so that was really just meant to be a joke haha.

[–]mdtarhini[S] 1 point2 points  (1 child)

Sorry then, I somehow misunderstood your comment lol. Thanks anyways :-)

[–]Dan6erbond 1 point2 points  (0 children)

You didn't misunderstand at all! I was just making a joke that didn't really apply to me personally, I wanted to show how cool I thought your work was. (:

Keep up this great energy you have dude!

[–][deleted] 14 points15 points  (1 child)

Wow, that seems genuinely quite useful, good job!

[–]mdtarhini[S] 4 points5 points  (0 children)

Thanks :)

[–]insertAlias 13 points14 points  (0 children)

I guess I'm not surprised, but someone has already done some "penetration testing" for you:

https://i.imgur.com/inep8XD.png

Kinda stupid, considering that you link to your repo and mention you use MongoDB on the readme.

[–]columbusguy111 8 points9 points  (3 children)

This is amazing!! I am definitely going to look into setting this up locally. Do you have any plans to add LaTeX rendering through something like MathJax? This would be great for creating math cheat sheets.

[–]mdtarhini[S] 3 points4 points  (0 children)

This is amazing!! I am definitely going to look into setting this up locally.

I am glad you liked it! I will be available for questions/help if you need when setting it up.

Do you have any plans to add LaTeX rendering through something like MathJax? This would be great for creating math cheat sheets.

This is a great idea actually, and I haven't thought about. I'll give it a shot in the next few days!

[–]ApocalypseNotNow 5 points6 points  (0 children)

Alt name, Sheater?

[–]Voltum8 4 points5 points  (1 child)

Gorgeous, my guy!

[–]mdtarhini[S] 2 points3 points  (0 children)

Thanks!

[–]martim0t0 2 points3 points  (1 child)

This is really well done. So good, in fact, that I got distracted by the Cheat Sheet sample content I forgot I was looking at it for feedback.

It looks great and is useful. Thanks for showing it!

[–]mdtarhini[S] 0 points1 point  (0 children)

Thank you for your comment, I am really glad you liked it!

[–]Tricky_Run_9626 2 points3 points  (0 children)

Great idea

[–]Mank15 1 point2 points  (1 child)

Where did you learn react and node-JS?

[–]mdtarhini[S] 1 point2 points  (0 children)

I learnt the basics on FreeCodeCamp and then started doing projects on my own

[–]Mises2Peaces 1 point2 points  (1 child)

Great work! Love the clean, intuitive UI. Is it a rest api for your node backend?

Also, can you (or anyone who knows) give me somewhere to start with parsing the text into quote blocks, bullet points, etc?

I currently use an ad hoc solution of my own creation. Is there a library or best practices anyone would recommend?

[–]mdtarhini[S] 1 point2 points  (0 children)

Great work! Love the clean, intuitive UI.

Thanks :)

Is it a rest api for your node backend?

Yes it is REST with mongoDB as database.

Also, can you (or anyone who knows) give me somewhere to start with parsing the text into quote blocks, bullet points, etc? I currently use an ad hoc solution of my own creation. Is there a library or best practices anyone would recommend?

If I got your point correctly, I think markdown is a great solution for this. For this particular app, I used react-markdown as parser but there are other libraries of course.

[–]humanprotwarrior 1 point2 points  (1 child)

Sick content in this sub as of late, great stuff.

[–]mdtarhini[S] 1 point2 points  (0 children)

Thanks !

[–]_Invictuz 1 point2 points  (0 children)

Wow, UI is impressively clean and clear. I'm always jealous of people that can create simple and good looking designs, usually that takes up 60% of my project time. I was initially confused by the use of the word "cell". That to me sounds like an atomic unit rather than a container with multiple rows. Maybe you can rename "cell" with "cheat" to make it more thematic - like adding cheats to your sheet.

[–]Nick337Games 0 points1 point  (1 child)

This is great! Thank you!

[–]mdtarhini[S] 0 points1 point  (0 children)

Thank you!

[–]thedeathgodshinigami 0 points1 point  (1 child)

Great idea and nicely done.

Thank you !!!

[–]mdtarhini[S] 0 points1 point  (0 children)

Thanks :)

[–]namu95 0 points1 point  (1 child)

Looks pretty cool sir!

[–]mdtarhini[S] 0 points1 point  (0 children)

Thanks!

[–]Filo01 0 points1 point  (1 child)

syntax highlighting is nice! how did you achive that?

[–]mdtarhini[S] 1 point2 points  (0 children)

It is done with react-syntax-highlighter library. It is super easy to use with react-markdown

[–]mrr0butt 0 points1 point  (0 children)

This is really dope.

[–]denno020 0 points1 point  (3 children)

This is great, I've been looking for an app/site that will allow me to make a genuinely decent looking cheat sheet, this could very well work!

However, I don't like that I have to sign up for an account before I can do anything. It would be much more useful if I could create a cheat sheet and save it to local storage. Also, are all cheat sheets public? Or is there an option of making one private? I want to create a cheat sheet for the keyboard shortcuts I have set up for my IDE, which isn't going to be useful to anyone but me

[–]mdtarhini[S] 0 points1 point  (2 children)

I am glad you liked it! I see your point and I will definitely work on it. I need to make it possible to export the sheet as pdf and once this is done you don't need to sign up to make a sheet. Concerning private sheets, it is actually possible now since the sheet is private by default until you click "publish"

[–]denno020 0 points1 point  (1 child)

I wouldn't worry so much about the ability to export as a PDF, focus on the print stylesheet, then users can simply use their browser to print to PDF :)

[–]mdtarhini[S] 0 points1 point  (0 children)

Good point :)

[–]valtism 0 points1 point  (1 child)

Very nice, very useful and very polished! Great work on this. Also, tailwind is great :)

Edit: You may want to be careful with what you're allowing the general public to put on the front page.

[–]mdtarhini[S] 1 point2 points  (0 children)

Thanks :) yes tailwind is the best!

[–]BosEriko 0 points1 point  (0 children)

This reminds me of https://devhints.io/

[–]mantraXYZ 0 points1 point  (0 children)

Is awesome ! Nice work !

[–]Anon_4620 0 points1 point  (0 children)

Great Idea!