r/learnjavascript • u/Am_abdou • Jul 11 '21
My first javascript project
This is my first front-end/design project, it's game called Hangman built with vanilla javascript, html, css and illustrator for the design.
It's my first attempt to try and learn the javascript language, please support the project if you like it.
Link to the github repo with a demo: Hangman.
13
10
u/dustandsepia Jul 11 '21
Never stopped loading for me on mobile ๐ฅ Iโm using safari on iPhone 11.
1
u/Am_abdou Jul 11 '21
Not sure why it's happening, did you try another browser?
3
u/_Invictuz Jul 12 '21
It's safe to say that it doesnt work on many mobile devices.
0
u/Am_abdou Jul 12 '21
The issue seems to happen only on iPhone devices tho, is it the same case for you?
2
u/_Invictuz Jul 12 '21
No the other guy said Android Chrome which is a bigger problem than iphone. I'm also on Android Chrome (Samsung).
My issue was different however. None of the three buttons (play...difficulty...) did anything when I pressed on them.
1
u/Brave-Ship Jul 12 '21
Same for me, on MacOS, Chrome. It said `createjs` is not defined in the console, in loader.js
2
3
7
u/queen-adreena Jul 11 '21
Project looks good. But if you're planning on using this as part of your portfolio, you need to document your code. Look into JSDoc conventions for this.
Otherwise, great job.
1
u/Am_abdou Jul 11 '21
Thank you sir, I'll definitely look into it i was a little confused when it came to documenting the project. Any helpful links?
4
4
Jul 11 '21
This is incredible! Really great work, especially for your first project ๐ Cant wait to see what you build next!
2
3
3
Jul 12 '21
Your "first" project ... hmm hmm ... of course xD
Well done anyway !
1
u/Am_abdou Jul 12 '21
Thanks man! It's actually my first ever project with js, I'm sure you can notice that if you take a deep look into the code.
2
2
2
2
u/tuvok86 Jul 12 '21
Very nice!! Only two remarks:
Try a different font (especially for main menu and scoreboard)
Allow keyboard input for the letter
looks great!
1
u/Am_abdou Jul 12 '21
Indeed keyboard input must be allowed, i didn't consider it, thank you so much for your feedback!
1
2
u/JustOsta Aug 04 '21
This is insane, great work.
And i am really curious about how did u start in doing such a project like that, do you have a physics background? I mean the way of implementing physics to javascript to do that animation for the hangman and the connected ropes, How did u implement all of that in just one month?
1
u/Am_abdou Aug 04 '21
Thank you so much man it means a lot to me! My background in physics comes only from high school and my own curiosity since I really love physics from when I was a kid, but that's pretty much it. When building this project, I spent some time trying to dig deep into the physics behind spring systems and found some great resources that helped me achieve that. That wasn't my goal initially tho, i just wanted a somewhat realistic rope animation, couldn't find any in the web so started building my own, it took me some time to make it work, i would say most of the time building this project was dedicated to building that rope simulation, but it was worth it in the end and i learned a lot from it. Again thanks a lot for the feedback bro, it keeps me motivated ๐
2
u/JustOsta Aug 04 '21
ู ุงุดุงุก ุงููู ุชุจุงุฑู ุงูููุ ุฃูุช ู ุจุฏุน ูุจุฏุงูุชู ุนุธูู ุฉุ ุฃุชุทูุน ููู ุฒูุฏ ู ููุ ูุฃูุช ุงูุถุงู ุฃุนุทูุชูู ุงูุญุงูุฒ :)
2
u/Am_abdou Aug 05 '21
ุจุงุฑู ุงููู ููู ุงุฎูุ ุชุญููุฒู ูู ูุณุนุฏูู ุฌุฏุงุ ูููุนู ู ููุฑุชูู ุจุงูุฏูู ุงูุงุณูุงู ูุฉ ู ูุนูุฏูุง ุงูู ุณุงุจู ุนูุฏูุง. ูููู ุงููู ุงุฎู.
2
u/machine3lf Jul 11 '21
Great work! Havenโt looked into the code too deeply yet, but one quick suggestion, keep your indents at 2 or 4 spaces. Seems like all your indents are 8 spaces.
1
u/Am_abdou Jul 11 '21
Thanks man! Thank you for the suggestion, my indent is setup to 4 spaces in vs code
3
u/machine3lf Jul 11 '21
Somewhere, maybe in github or maybe in vscode, you have indents displaying as 8 spaces.
Also, you are using indent characters instead of spaces for your tabs,
There is an old debate about whether spaces or tab characters are better for indents. (I prefer spaces, fwiw). Regardless of which side you may come down on that, because you are using a single tab character, it's getting rendered as 8 spaces in github for some reason, which pushes your code out pretty far to the right.
1
2
1
0
Jul 11 '21
[deleted]
16
u/Am_abdou Jul 11 '21
Thank you so much sir! It took me about a month but it wasn't just coding, designing the background also took me some time
0
Jul 12 '21
[deleted]
1
u/Am_abdou Jul 12 '21
Not sure what you mean by how much, checkout the repo to see exactly how many js lines of code were used, the hardest part was coding the rope.
I learned the fundamentals from codecademy, from there it was pretty much youtube and reading documentation.
And thank you so much, I'm sure you can pull something better! You can use my project to to get some inspiration and help. Happy coding!
0
0
Jul 11 '21
[deleted]
1
u/Am_abdou Jul 11 '21
Thanks you man! Yeah the project focuses mainly on the client side, i wasn't worried that much about the server side, since the words are fetched from free web API'S, they were mainly intended for demo purposes and they're not necessarily accurate when it comes to categorization. If this was a real project I'd probably build my own api.
0
Jul 12 '21
[deleted]
2
u/Am_abdou Jul 12 '21
Man thanks a lot, your comment has really motivated me to work harder next time. I really appreciate it ๐โค
0
19
u/clawdius25 Jul 11 '21
This is definitely a good project! 10/10 would hang the guy again.
Quick suggestions about your project:
- When a player reached game over, please show the correct answer. I don't wanna die thinking what kind software end with "-ions".
- After player correctly guess their words, please include a "game over" menu again. The game can be reset by pressing home icon in the top right.