My first Hack-a-thon! pt.1

Jonathon McClendon
3 min readMar 5, 2022

--

Fresh out of Flatiron school Im eager to learn as much as Ican about collaborative programing, so my friend and mentor Leonardo Acosta suggested we get together and have a hackathon. Don’t worry it sounds more devious than it is. A hack-a-thon is a broad and vague term that can mean many things. It could mean a competition of groups competing to create an app or challenges. Sometimes it mean competing against the clock or your self.

Over beer (Mar 6th) we discuss some application ideas that would push our knowledge. We eventually decided to create an application that connects hosts that curate house shows with attendees. We had many ideas that fell out of the scope for a two day coding sprint, but we eventually decided that our scope would include

  • account creating & authentication
  • The ability to upgrade your account to a host
  • As a host be able to add show to a calendar.

Leo and I are both backend preferring individuals, but for the purposes of getting as much as I can out of this project I decided to handle the client side of things using React. Leo want to test his knowledge of Express.js so that will be our backend framework.

(Mar 7th 12pm, Dallas Texas)

Leo created the repositories for our application. He made the frontend separate from the backend. We got some initial environment set up the first hour. Then I picked Leos brain for about 30 minutes. Having learned React.js recently, Im not an authority on what the common standards for file structure are concerning: images, pages, and components. He did a great job of explaining it in a way that could understand. Views are still technically components, but they obviously function differently and should be segregated on our minds.

src
├──views
│ ├── Home
│ │ └── index.js
│ ├── Contact
│ │ └── index.js
│ └── Profile
│ └── index.js

└── components
├── header.js
├── footer.js
└── contactForm.js

Already learning so much!

TimeStamp: 3pm

Not getting as much done as i anticipated but in hindsight, react is fairly new to me, having only finished the courses yesterday. So all that being said, I think i’m right where i’m supposed to be… Considering I am also taking breaks to intermittently blog about the experience. “I’ll tell you when we’ve gotten too meta!”

✅ Got my file structure down

✅ installed & implemented react-router

✅ installed bootstrap (NOT REACT-STRAP)

✅ Header/nav component

✅ Footer component (simple)

TimeStamp: 4:45

✅ Card Component DONE!

The show view cards are looking good and i’m feeling good. All content is place holder at the moment waiting for end points form Leonardo Acosta. They are inbound. We are set to take a break / walk to get red bull to power through our second session at 5:30. Will install and implament Redux when the endpoints are done.

Check back for part 2!

--

--

Jonathon McClendon

Software engineer, Recording Artist, and former Days of our lives actor