Zzzz.. I participated in the Sitecore Hackathon this year, my second consecutive year and wanted to write some of my thoughts down on the experience while they were still fresh. Let's start at the beginning.

I opted for participating as a solo team this year. I went into this event with the mindset that I would do whatever the announced categories were in Sitecore JSS. I've spent a lot of time over the last year working and discussing it so I felt like this was the best choice. I think I told people who asked me that I was "JSS or bust" for this event.

The Day Of

The very beginning. I would tell you to sleep in the day of but meh. Get as much sleep as you feel like the night before. You're going to be tired anyway so just embrace it. I had Friday off (thanks Velir!) and spent a good chunk of the day just relaxing. I stayed away from my computer because I knew I'd be staring at it for almost a day straight starting later that evening.

I went to the store and gathered some snacks. I purchased some Red Bull but mostly stuck to coffee throughout the event. Purchased some quick to prepare meals because I knew that sleep deprived me probably wouldn't be up for cooking anything too complex. Like all things hackathon, keep it simple. Try to keep it healthy but not too healthy, you know?

The Email

The announcement email for the ideas and themes of the hackathon get announced an hour before the event starts at 8PM. I honestly was most nervous to learn about the categories this year. I personally feel like coming up with a good enough idea to win is pretty difficult.

The categories for the event this year were as follows:

  1. Sitecore Meetup Website – In recent events the Meetup.com site began charging for the registering and hosting of meetings as well as other features previously free. Many of the Sitecore User Groups rely on Meetup
  2. Sitecore Marketplace Website – The Marketplace was once a destination for popular modules to be showcased to the community. Consider the ways in which modules can be shared and installed.
  3. Sitecore Hackathon Website – This idea is sooo meta! Several years have passed with the current version and it’s in need of a refresh.

I was honestly surprised. Unlike last year, these categories had the idea already described for you. You knew immediately exactly what you had to build, as opposed to "Build a content authoring component," which requires you to brainstorm the idea first. I was pretty relieved here.

My choices quickly narrowed down to two options — Sitecore Meetup or Hackathon. I've built sites like these in the past and when it comes to hackathons, you should be able to rely on all your previous experience and let it carry you forward. Hackathons are not the best time to learn something from scratch as well as try to meet the submission deadline.

The Category

So ultimately I chose the Meetup website. I personally interpreted this category as something that would need the following core features:

  • Create a group - This is core to Meetup, it's one of the first things you do if you are organizing a group. You create your own group that other people are able to join.
  • Join a group - Another essential requirement. Why bother even having a group page if you can't join it?
  • Create an event - Groups host events and promote various activities through this.
  • Attend an event - Another core activity on Meetup. This functionality allows the organizers who to expect.

The rest is really just extra. At a minimum, whatever I came up with had to have these features and any other idea for the site was secondary and could be classified as "nice to have" if time prevailed.

The Work

So because I already knew I was going with JSS, I was able to quickly spin up a project using it. I tweeted after starting my project that I was going to be using Svelte and in particular, jss-svelte, which is an integration that I built for Sitecore JSS.

I love Svelte and feel like it lets you focus on what's important when building sites using it. Hackathons are all about measured risk, I wouldn't have personally chosen it if I hadn't worked with before. I probably would have stuck with React just for the sake of needing to get something done, but I was comfortable with making that decision and felt like it was well suited for the job.

The first hour or so was not spent coding at all. I was just scaffolding components with jss scaffold, building various components with mocked out HTML, not connecting any fields or anything. Just placeholders and HTML. I had a few forms on my site and I replaced the buttons with just links so I could see how the flow of my application felt. All of the sample applications, jss-svelte included, ship with Bootstrap included so I stuck with that.

I managed a Trello board which had four categories "Not Started", "Prototype In Progress", "Prototype Complete", "Implementation In Progress", "Implementation Complete". I found myself sticking to it closely in the beginning, even adding small tasks just to have the satisfaction of marking them complete. Would recommend. Celebrate those mini-victories.

The Pivot

I went through this whole process thinking I would just store all of the user created data in the Sitecore tree. Individual groups could live under a "Groups" folder and organizers would be added to a Sitecore security group that allowed them to create Event items under their group node. I really liked that idea, in theory.

The obvious thing I didn't like was allowing people to add to the Sitecore tree. Most CD servers also are likely to have the master database removed from them as well so that was another issue. So after creating a few GraphQL mutations to support this behavior, I pivoted.

I switched to writing all data that was created from the site to a Hasura instance that I had hosted. I honestly love Hasura and the admin interface for it is amazing. You're able to build tables with a nice admin interface and it generates a GraphQL schema that allows you to do all of the CRUD operations you would ever want to do through GraphQL. I can't say enough good things about this project and would recommend you check it out if you're interested in GraphQL.

So I rewrote the mutations I had already written to just write to Hasura instead and was resolved to stick to this pattern. My only complaint was that it was a little tedious. I wrote a GraphQL query which called Hasura and then I wrote a custom query or mutation implementation to add to the Sitecore GraphQL schema ... and then I wrote another GraphQL query to query the Sitecore GraphQL service from my component. I felt like this was the right choice because it protects my Hasura API key and gave me the ability to enforce security and simplify the query parameters in some cases, such as ... don't pass a user ID from the JSS application, the server already knows who you are.

Choosing this technique slowed me down compared to just querying Hasura directly though. Every new functionality required that overhead and it was sooo tempting to just query Hasura directly. I might explore "Allowed Queries" in Hasura in the future and attempting to query the service directly.

The Choices

Choices are a huge part of hackathons. You will make decisions you might not have time to unwind and you'll have to live with them and make the best of them. I regretted the overhead I added for writing new component that needed to query group or event data and knew that spending time duplicating that work, even if it was definitely the right choice, was time I would not have at the end making everything look pretty or adding some "nice to haves."

Live look at me thinking about refactoring code during the hackathon:

via GIPHY

You'll have to take measured risk during events like these if you want to have something to submit at the end. I chose to keep the structure of my queries as is instead of refactoring to make them simpler because I knew it worked. If I decided to move to a different pattern, who knows.

The (little) Sleep

Last year I participated in the event with a group and we were all in the Velir office. I could have found somewhere to sleep there but we worked through the tiredness and stayed up through the entire event.

This year was slightly different. I participated in the event from my house so when I felt myself hitting the wall where I felt like I would be more useful after a little nap, I chose to take one. I slept for two hours in the middle and it made a huge difference. That little power nap allowed me to feel at least a little refreshed and ready to make a big push on the entry.

The Time

There's never enough time. Especially solo. I honestly had suspicions I would not be able to complete my submission at about 4AM. I kept pushing through though and was able to hit my stride and make fast work of some components. I completed all of the core functionality at 6PM, which gave me two hours to write documentation and record a walk through video for the submission. Would recommend making these sooner so you don't have to tackle these when you're exhausted.

The Entry

My entry had a version of everything I was hoping for. I created all of the features outlined previous and included a login and sign up form. I would love to write here that my entry was the most beautiful and polished thing I've ever produced but ... it wasn't. I focused on functionality instead of making it pretty. Pretty was "nice to have" in my book. I spent very little time after my prototyping phase because I knew that if I could get to the end of the hackathon with some time to spare, I could spend it cleaning up the interface. It didn't happen though. Solo hackathon life is tough that way.

There are things I wish I implemented differently and I'll probably continue to hack on the site over time because I think it would be a great demo site for something built with Sitecore JSS and Svelte.

You can hear tired me give a walk through of my entry here:

Conclusion

I had a great time participating in the event. It was great seeing everyone's photos throughout the hackathon and I appreciate everyone who reached out with words of encouragement. I purchased some beer in my preparations for when the hackathon was over. That first sip felt well earned.

I would recommend looking into joining next year if you didn't this year. The Sitecore community is strong and I suspect you'd have fun hacking on something you might not normally be able to during normal business hours.

Thanks for another great hackathon everyone!