How to Build a Full Stack Voting App with JavaScript and Node.js

Поділитися
Вставка
  • Опубліковано 9 бер 2022
  • View the Code and GitHub Repository:
    dcode.domenade.com/tutorials/...
    Insomnia API Client:
    insomnia.rest/download
    In today's video I'll show you how to create a full stack voting app (a.k.a. poll system) with a frontend and backend.
    We'll use HTML, CSS and JavaScript to build the client-side (frontend) and use Node.js and Express to build the server-side (backend).
    Topics covered:
    - Classes
    - Async/Await Functions
    - Event Listeners
    - APIs
    - GET and POST requests
    - Form Data
    - Reading and Writing JSON
    🏫 My Udemy Courses - www.udemy.com/user/domenic-co...
    🎨 Download my VS Code theme - marketplace.visualstudio.com/...
    💜 Join my Discord Server - / discord
    🐦 Find me on Twitter - / dcodeyt
    💸 Support me on Patreon - / dcode
    📰 Follow me on DEV Community - dev.to/dcodeyt
    📹 Join this channel to get access to perks - / @dcode-software
    If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
    #dcode

КОМЕНТАРІ • 29

  • @mohammed.haydar
    @mohammed.haydar 2 роки тому +9

    decode strikes again with another GREAT IDEA🔥🔥, thanks bro for all of the beautiful useful content 👌🏽

  • @oguznsari
    @oguznsari 2 роки тому +7

    thanks dcode, minor advices for everyone:
    1. we can fix the indentation issue when writing to the JSON file, by simply pretty-printing the parsed json like:
    await fs.writeFile(dataFile, JSON.stringify(data, null, 2));
    2. we can take 1 decimal only from a percentage like:
    percentage: ((100 * votes) / totalVotes).toFixed(1) || 0.0

  • @hoasfifsde6680
    @hoasfifsde6680 Рік тому

    Excactly what I wanted to make but didnt know how to thank you very much for teaching it !

  • @guillermomoranduzzo3647
    @guillermomoranduzzo3647 2 роки тому

    Great video man.. thanks a lot, really really useful !

  • @NFLStudy
    @NFLStudy Рік тому

    Excellent! Thank you.

  • @hassaneoutouaya
    @hassaneoutouaya 2 роки тому

    THANK YOU SO MUCH!

  • @sardorulmasov8894
    @sardorulmasov8894 2 роки тому

    Thnx man!

  • @vidnchi7178
    @vidnchi7178 Рік тому

    Thank you very much

  • @abubalo
    @abubalo 2 роки тому

    There is nothing sweeter than a newly baked Dcode tutorial

    • @hongpair
      @hongpair 2 роки тому

      How are you my fellow web developer

  • @marcoss4563
    @marcoss4563 2 роки тому

    there is a extension for vscode called Thunder client, its pretty for testing APIs. :)

  • @mikeonthebox
    @mikeonthebox 2 роки тому +5

    Would be nice to see an advanced version of this same concept. Like one that prevents receiving votes from the same PC. It's the details that may bring some more value. On a poll system, a functionality one expect is some basic (or advanced) way to prevent a single user from submitting several votes.
    Also been able to create polls would be cool too and that will add dynamic routing and a whole lot more.

  • @donhathong112k
    @donhathong112k Рік тому

    thank you so much 🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏

  • @zarinazhiyenbayeva8474
    @zarinazhiyenbayeva8474 2 роки тому

    Thank you a lot for the all videos, they are very useful!!!
    By the way, the link on the Udemy course doesn't seem to be working… Could you share the correct link, please?

  • @60secondsofcoding58
    @60secondsofcoding58 2 роки тому +1

    I have noticed something that differs your videos from most of the other tutorials I follow, and that is that you always start with the back end where almost all other tutorials start with the front end and then switch to the back end when the front end is done.
    How come that you prefer to it the other way around?
    Just asking of pure curiousity.
    Thanks for the great videos you deliver!

    • @DailyNevFacts
      @DailyNevFacts 2 роки тому +1

      I have a friend who develops like this and his theory is getting functionality first then looks after! could be the same here.

  • @mohammad-hosseinhashemian6804
    @mohammad-hosseinhashemian6804 2 роки тому

    thhhhhhhhx a lot!
    can anybody tell me what font it is

  • @ChipyGamingVideos
    @ChipyGamingVideos 2 роки тому

    Hey dcode, great video! I was wondering if there was a way to make it so if you're viewing the poll, it will update every time anyone votes. For example, you have tab 1 and tab 2 both haven't voted. Tab 1 votes, the percentage is now 100 - 0 - 0. Then tab 2 votes, the percentage is now 50-50-0, but tab 1 still sees 100-0-0. I assume you refresh anytime the data changes?

    • @FelicitationHumain
      @FelicitationHumain 2 роки тому

      Did you find any solution ? I have the exact same problem.

    • @paladin9876
      @paladin9876 Рік тому

      @@FelicitationHumain you would need websockets to update it in live time (i wouldnt use this for a voting system anyways)

  • @everythingyouneedtoknowabo5311

    my issue is where did that untitled file come from and the braces inside seem had to get through .... time stap to my question is 7:41

  • @vivencedor1333
    @vivencedor1333 Рік тому

    Hi, I can't test the code from client side... It keeps showing net err refused and uncaught in promises
    Please someone help

  • @juguetestoys1137
    @juguetestoys1137 2 роки тому +1

    hi, super !! how can I put this app online in a web hosting ??? how can I deploy this to create a dist folder with all the files

  • @nehacs2010
    @nehacs2010 Рік тому

    Hi hava doubt sir please help me

  • @dogvscatfunny9956
    @dogvscatfunny9956 11 місяців тому +1

    I didn’t understand him anymore, that he began to address at all, nothing was clear at all.