First feature with DO App Platform | DO Hackathon 🚀

ManuelDev — Wed, 16 Dec 2020 00:16:31 +0000

Day 1

We started out strong, go get a cup of coffee.
According to the previous post in this series, now it's time to create a small feature so as not to have a blank screen. We will see portions of the feature code and other steps that I had to do to mount the app on the new DigitalOcean platform. Let's go!

CODING SIDE

coding the feature Let's start by setting up the countdown function, passing it the tentative launch date of the project. I put it as January 04, 2021, this is the code that makes it possible.

Then follows the creation of the component, which will update its value through the result of our core function. Note that we use modern React syntax (hooks and functional components). The code was such that

We quickly add some styles as good frontend developers so that our screen is beautiful. Dont forget the emotional gif haha.

DIGITAL OCEAN SIDE

(Mini-tutorial)

Once the code is in the repo, we go to digital ocean (APP PLATFORM) It's really easy to upload a project here, they did a great job. We go to the new option on the left app to start

After that we give LAUNCH YOUR APP, that button

We connect our repo and select it, we can have a limit of 3 static projects for free.

We select a location where the app will be hosted, and then we select that it is a static project. We give the following and we will select the free plan. Next and done. After this, just wait for the app to be configured on the platform (I was able to go get my coffee, since it took a few minutes to finish)

☕☕☕☕☕☕☕☕☕☕☕☕ ... ⏰

It's all! If everything goes well it should be something like this.

We test the app through the link they give us ...
AND VOILÁ, ITS ALIVE! 💛 and is dynamic. You can visit this here

Its all for today. In the next post we begin to rub shoulders with the landing of the project. Get ready to grab frontend and lots of css. Don't forget follow me for more content!

Ok here we go! | DevTo / DO Hackathon

ManuelDev — Tue, 15 Dec 2020 04:04:44 +0000

FIRST OF ALL

I must say dude, is my first hackathon, so i'm little nervous. Lets start. I plan to document my progress here and on my personal blog as the days go by.

The millionarie IDEA (or no)

I thought of a problem that I have at home and probably other people as well, the uncontrolled consumption of electricity, it is something simple but it can help you save some bills and at the same time inform the benefits of saving energy for the Earth as a page of destination.

DAY 0

You can see the repo here

Creating the repo and first plan I didn't do much today, let's say I was planning the phases that I will have to go through to finish this on time.

The first step to prevent them from seeing an empty page in the process is to publish a small React app with a countdown towards the estimated project completion date.
There is a guide from which I was inspired, here you can see it.

once created I will upload as seen in the next update with the link

Resume steps

create the landing page
deploy the static resources
implement node for some features (sockets and some endpoints)
code refactor ...
deploy all repo features on DigitalOcean throught an powerfull CI/CD tool >:)
be happy eating pizza

Its all for this article, see you in the next! Dont forget follow me for read this adventure...

DEV Community: ManuelDev