Spring 2021
Web Development Challenge

Product Page Game Landing Page

Project #8 - Tech News Site (Failed)

red cross representing failed project

Start Date: April 20

End Date: April 22

Blog Post

Marking this one as a failed attempt was a painful call to make. I had a handful of hours left to work on it within its 3-day development period, and I could even have taken an extra day if I thought it would help. And the challenge rules don’t state that I have to ship anything good - I fully expected that this month would produce a handful of dumpster fires. Ultimately, though, the final product I was on track to create wasn’t really anything of value - of course it looked terrible, but not remarkably terrible.

The goal this time was to create a mock news site. For its design, I used the front page of the BBC news site as my primary inspiration, but tried to give it more of a “technology-oriented” feel. To implement it, I used two tools in particular.

First, I decided to build this using the 11ty static site generator. I’ve decided I like 11ty quite a lot, and will definitely be using it again. Any issues I had developing with it were largely my own fault. In particular, I made use of the pagination feature to create a lot of random news articles all at once, but found myself at a loss for how to sort through and manage them effectively. In retrospect, it might have been more beginner-friendly to randomly generate files instead of raw data, but that’s a concern for my next 11ty project.

Secondly, I wanted to try something different with my styles, so I decided to work with Tailwind CSS for the first time. ...Tailwind is fascinating for a few reasons, but I don’t have the space to write about it here. Suffice to say that the best starter project for Tailwind is probably more like “two paragraphs and a link” than the “fully-responsive, image-heavy layout” I had mocked up. I’m simply too slow with the framework to quickly style dozens of elements, and adding 11ty’s templates to the mix only made it harder.

Disappointing end to this project, but it’s not like I got nothing out of attempting it. Let’s keep going.

Remarks

If you've read the entry for Project #7, you'll know I was feeling pretty optimistic coming out of that one, and eager to get started on #8. That feeling didn't last especially long. Unlike my first failure, I did everything in my power to make something complete, and made the best of the project's allotted that I could, only marking it as a failure during the final few hours. As I mentioned above, it comes down to the two main technologies I used, and to the fact that both of them were new to me.

11ty was one such tool, and it turns out I quite like it - in fact, this very page was rewritten in it once April ended. But there is definitely a learning curve to it (one I still haven't fully climbed), so it's no surprise in hindsight that I was bogged down in trying to figure it out.

As for Tailwind CSS, I don't think I'm in a position to say much about it. I just kind of sucked at using it, so much so that it was almost nostalgic - the quality reminded me of the ancient HTML-only pages I used to make in middle school. I'm sure I could overcome that clumsiness given a concerted effort, but I'm not what I would think of Tailwind once I did. Fortunately, there are plenty of other opinions to be found elsewhere on the internet.

Product Page Game Landing Page