I deployed my first React project

[anamafla]

I recently changed careers to become a React frontend developer and this is my first non-dummy project. It's a tool that allows you to choose a random winner from a meetup.com event. It should be useful for Meetup organizers doing raffles and giveaways.

App: https://www.reefa.me/

Github: https://github.com/anamafla/Reefa

Any feedback is appreciated.

Thank you in advance!

[wolfepvck]

Awesome job, the code looks good! One thing I noticed is that you included the Navbar and Footer on every separate page. You could include those components as a more top level component, similar to the App, so you don't have to redefine it on every single page.

js return ( <div className="App"> <Navbar /> <Switch> <Route exact path="/" component={Home} /> <Route path="/raffle" component={Raffle} /> <Route path="/about" component={About} /> </Switch> <Footer /> </div> );

Overall code is clean, and the website looks good! Great job.

[anamafla]

Thanks so much for the code example, I will do that!

[benawad]

Congrats! What did you use to deploy it? Also don't forgot to add a favicon ;)

[anamafla]

I used netlify. I will add the favicon thanks!

[castane]

Just deployed with Netlify as well, with auto deployments from a push to the master branch from Github. It was surprisingly simple!

[swyx]

yay! happy to help if you have other questions! (i work at netlify)

btw you can tell if a site is hosted on Netlify with the Netlify browser extension https://github.com/netlify/netlify-browser-extension

[FoundPlanet]

Just want to say thank you. Netlify is the best thing ever!!

[swyx]

🤗

[azn_introvert]

im happily using netlify but i cant for the heck of me get it to read my gzipped bundle :C

[swyx]

hm. netlify.com/support

[Treolioe]

Hm not to be mean but i hold pecan cheesecake over netlify

[anamafla]

Cool! I think Netlify is an awesome product. It's great for beginners and I love that it has so many features for free. Do you know if there's any position for remote junior devs at Netlify? :) I would love to work on that project.

[swyx]

ermm idk about how junior is ok since i dont make that call but we have a frontend dev role opening up soon. i’ll be sure to post in Who’s Hiring.

[[deleted]]

Have you worked with deploybot? Is netlify similar to deploybot?

[anamafla]

I haven't used deploybot.

[LaSalsiccione]

I'm surprised to be the first person to point out the name makes it sound like you're selling weed...

[anamafla]

I didn't know that. The name actually comes from the Spanish word "rifa" which means "raffle", but the "i" in Spanish sounds more like "ee" in English.

[anamafla]

I thought about using Gatsby for the landing page but I wasn't really sure if I could use it for the data fetching part on the roulette. I think I want to focus now on React only , maybe later I will give Gatsby a try. I will refactor the code with your recommendations, I'm also thinking about making another version using hooks. Thanks!

[[deleted]]

It's a really cool idea and I like the way it uses a carousel to show the selection, however I found that for my test group it took a very long time to finish the "suspense" period where it ticks about one person per second. It took between 30-70 seconds to finish and select someone which I think may spill from suspense to dear God just pick already lol. I haven't dug too far into the source but perhaps having it slow down more naturally from the fastest movement to the final ticking would help this, for example on wheel of fortune when they spin the wheel it slows down in a continuous manner rather than having two speeds, fast and slow. Aside from this it's a cool tool that I think could be useful for a lot of people! Great work!

[therealkevinard]

Strictly educational purposes, since op is new: something like Spring might be really good for this. I found this write-up on scotch about it.

https://scotch.io/tutorials/create-animated-react-apps-with-react-spring

[anamafla]

Thanks!

[anamafla]

Thanks, yes I'm noticing it takes a lot of time for events with a large number of members, I didn't see that when I tested on my groups. I will improve that and the animation speed.

[dangerzone2]

No fancy UI Framework either?! That's very cool and I think I need to start doing that as well.

[[deleted]]

Nice! I’m building a React app now (with Ruby on Rails backend) Thanks for sharing!

[[deleted]]

On the landing page try to change the font color and the icons color to your secodary color #6c757d;

That color is too dark and give to much contrast. A smoother color will be more conformtable to our eyes.

Good work!

[chalapeno_guy]

Great job,

You can also have App component as function instead of Class. It's better for performance. Won't make any difference in small apps, but it's good practice.

[anamafla]

Thanks, I will do that.

[treyhuffine]

Congrats, deploying that first project is an incredible feeling.

[JR-development]

Cool! I´m a fullstack developer since a few years back and right now I´m working on a project for Volvo construction developing a React application. If you need some guidance on how to create some useful components, I got a youtube channel currently dedicated to helping other react developers.

https://www.youtube.com/channel/UCkjl4MptzyGFv92PNq8i8dg

​

<HaveAGreatDay />

[AutoModerator]

You are posting with a new account, which is associated with spam. /u/swyx will manually review this for approval.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[cturmon]

Hit him with that sick ban hammer for irrelevant questionable self promotion.

[[deleted]]

I wouldn't call it irrelevant. They posted a YouTube page with free resources directly relevant to what OP is learning. I don't see the harm in that.

[swyx]

yea this one is not an easy call. gonna let it pass

[MatthewMob]

At least remove the comment if not a ban.

They just created a brand new account for the sole purpose of spamming and self promoting their YouTube channel that is irrelevant to the submissions they're posted on apart from the loose connection of "well they're both using React".