Web App Feedback + Hosting on AWS

Project Feedback
#1

Hi all,

So I’ve just finished working on my first big personal project, bought a domain name, created an AWS account, watched a lot of AWS tutorials, but I still can’t figure out how to host my web app on AWS. The whole AWS thing is a mystery to me. No tutorial online seems to teach exactly what I need.

What I’m trying to do is this:

  1. Host my dynamic web app on a secure https connection.
  2. Host the web app using the personalized domain name I purchased.
  3. Link my git repo to AWS so I can easily commit and push changes when needed.

Please assist me by pointing me to a resource that can help me achieve the above 3 tasks.

For now, the web app is still hosted on Heroku’s free service; feel free to take a look at the application, and provide some feedback if you can.

Link to web app: http://biggie-beta.herokuapp.com/

#2
  1. If you’re using EC2 instance, you can follow any tutorial that shows how to host a webpage on linux (Digital Ocean has good tutorials: Tutorials | DigitalOcean). Use Letsencrypt for SSL.
  2. In Route53 in Hosted Zones you need to create all required records (A, NS, CNAME etc.) (How to Register a Domain Name – Amazon Web Services)
  3. For CI/CD I’ve used Travis, but it was long time ago since I set something up. But the idea is to create a .travis.yml config file and link your repo in Travis. Example of config: spotify-clone/.travis.yml at development · jenovs/spotify-clone · GitHub.
1 Like
#3

Hi @csibanda17 !

I am little confused by the game.
I tried to follow along with the instructions but I was still confused.

I put in a number for the stakes and get this

Screen Shot 2021-02-12 at 11.29.06 PM
Screen Shot 2021-02-12 at 11.29.06 PM1968×910 40.7 KB

Then it says there should be a list of numbers but I don’t see that.

Screen Shot 2021-02-12 at 11.31.25 PM
Screen Shot 2021-02-12 at 11.31.25 PM2560×1232 97.9 KB

So maybe you can add some screenshots to the instructions.

Hope that helps!

1 Like
#4

thanks @jenovs . I’ll go through the resources you provided.

#5

Hi @jwilkins.oboe . Thanks for pointing out the confusion. I’ll definitely add screenshots and more detail to the instructions.

But the general steps are as follows:

  1. Type in a stake amount
  2. Click the generate button
  3. Select a number out of the ones displayed on the screen
  4. Click the check button to find out if you’ve won or lost
1 Like
#6

I tried those steps but I am not seeing any numbers.

I was testing out the demo so maybe it works differently when you are signed in.

#7

@jwilkins.oboe , Oh, I see. Everything seems to be working well on my end. Kindly send me a screenshot of what pops up when you click the generate button, so I can make a fix.

#8

So I click 1 in 2

Screen Shot 2021-02-12 at 11.47.11 PM
Screen Shot 2021-02-12 at 11.47.11 PM696×1280 61.7 KB

Screen Shot 2021-02-12 at 11.47.58 PM
Screen Shot 2021-02-12 at 11.47.58 PM1290×264 18.6 KB

This pops up

Screen Shot 2021-02-12 at 11.48.20 PM
Screen Shot 2021-02-12 at 11.48.20 PM2450×1090 88.3 KB

I click generate and get this

Screen Shot 2021-02-12 at 11.48.41 PM
Screen Shot 2021-02-12 at 11.48.41 PM2544×1120 106 KB

#9

Hey there,

the counterpart to Heroku on AWS should be AWS Elastic Beanstalk.

Sure, you can rent your own VPS (EC2), but you also have to administrate this (Linux) server.

2 Likes
#10

When I just put 1 for the stake then it works like it is supposed to.

So, if there is a limit then that should be clarified in the instructions.

1 Like
#11

Oh, thanks for the screenshots; now I see where the problem lies. Because this is just the demo, I limited the amount you can stake to $100 (dummy money of course). So when you try to stake any number greater than $100, an error pops up letting you know you have insufficient balance to play the game. Which means in the demo, you can only stake $100 or less.

But I guess I should increase the limit to a few thousand dollars, to avoid the confusion next time.

Thanks very much!

#12

I do see 100 in the corner now but I didn’t know that was my current money.

You can keep it at $100 but I would add some text below generate and check that says
“You currently have $100 in your account”

Because I missed it when it was up here

Screen Shot 2021-02-12 at 11.56.16 PM
Screen Shot 2021-02-12 at 11.56.16 PM1590×202 27 KB

1 Like
#13

Thanks @miku86 , But I’ve been trying a few services including EC2, Elastic Beanstalk and Lightsail. Nothing has worked so far. So I’ll keep going through the resources to make sure I understand how the whole thing works.

#14

Yeah, good thought. You quite clearly understand design and user experience more than I do. I took everything for granted when I designed this thing, thinking if I understand how it works, then everyone else should get it too; haha, I was wrong.
Thanks very much, let me work on fixing everything you pointed out.
Feel free to let me know of anything else you find amiss.

1 Like
#15

Sometimes when we are building projects we know how it is supposed to work but when another pair of eyes looks at it then they are able to point out things for improvement.

The same thing happened to me when I shared my first project a couple of weeks ago.

I understood how the ui/ux worked but for others looking at for the first time there some things that needed fixing.

It is all part of the process :grinning:

#16

Totally agree. It’s a fun process though, provided you appreciate constructive criticism. And receiving feedback is one of the many advantages of rolling out a beta site first before launch.

1 Like
#17

So I’ve tried it but may be because I had gone the @jwilkins.oboe feedback, i didnt have any problem, just wondering the numbers? Are they just random numbers that you have to guess? Do they represent something? Unotaura here kana kuti unokhuluma? Innovative idea.

1 Like
#18

The numbers are random. The code displays random numbers on the screen every time you click ‘Generate’ and it selects the winning number randomly. There’s no pattern to the displayed numbers and the winning numbers.

#19

Great idea, just a suggestion, over time isn’t it more interesting if the numbers have a story to them. Maybe something like one of these numbers is Obamas birthday. (You have 5/10secs to answer - just so people have no time to google)

1 Like
#20

So I played a bit with AWS Beanstalk and it’s pretty straight forward:

  1. In Elastic Beanstalk console create a new enwironment.
  2. In Route53 create DNS record.
  3. Add SSL: Configure HTTPS for Elastic Beanstalk environments
  4. Configure Travis CI: AWS Elastic Beanstalk Deployment - Travis CI (the trickiest part).

Result: https://node-test.jenovs.com/ (it just generates random number) (shut it down because my aws free tier has long expired :money_with_wings: )
Repo: GitHub - jenovs/node-test

1 Like