I’ve been working at this little web app for a bit over a week and thought I’d share what I’ve discovered.

PS: I’m looking for work!

Contact me on Linkedin

About The Project

Check out a video demo!

I decided to undertake this project because I wanted to prove to myself and possible employers that I can quickly adapt to new tech stacks and create working prototypes.

Ultimately, I think I accomplished that goal.

Unfortunately, I failed to see just how detrimental some of the choices I was making would be when actually creating a working web app.

Here’s why:

• Deno is an incredible javascript runtime. It even support npm modules. However, it barely supports npm modules. Many of the things I tried simply did not work.
• Deno Deploy is an awesome service for deploying your deno based apps. Unfortunately, it does not support Deno’s npm: specifier. The feature that allows you to load commonjs npm modules.
• Because Deno Deploy did not work, and I wanted a live demo of my web app, I had to spend countless hours researching and testing alternatives. This was not productive.
• Many Node.js libraries and frameworks that appear to function end up having issues down the line This meant that I had to redo entire sections of the app when a specific things suddenly wouldn’t work in my Deno environment.
• Database drivers, query builders, and ORM’s are still kind of underdeveloped for the Deno runtime. My initial plan was to use Prisma, but for reasons stated above, it didn’t work out. Instead, I opted for Mongoose. I’ve never used MongoDB and still have very little idea how it actually works.
• Preact is awesome, and this project only made me love it even more. The problem is that when I use a React based library, I am now using it through two compatability layers: Deno’s npm support, and Preacts compat layer.

Of course, even with all of the above roadblocks, I perservered and stubbornly pushed my way into creating a working web app.

Does this web app scale? Absolutely not. There is no recommendation algorithm for posts. There is no pagination. I have no idea how to scale a MongoDB database, but the way I’m interacting with it right now is for sure not going to scale.

The web app is stateless, and I could load balance between servers without too much concern, but that’s about it.

Is this a good example of a Deno Fresh project? Again, no. This code base is filled with repeated code, too much interactivity, and not enough thought towards its architecture. If I were to start over with Deno Fresh and only Deno based modules, I think I could do a much better job of leveraging Deno’s “ship no javascript by default” approach. As it is now, almost every component is an island. That’s definitely not using Fresh as intended.

Built With

These are the major components of the web app.

• Deno
• Typescript
• Fresh
• Preact
• Twind (A Tailwind clone without a buildstep)
• JWT Auth
• MongoDB with Mongoose

Project

Project Link: https://github.com/Micheal-Earl/mitwi

Acknowledgments

When making this project, I heavily referenced “Code with Antonio’s” twitter clone. His clone was made with Node, Next.js, and Prisma.

• Code With Antonio

I’m working on a new portfolio piece to demonstrate that I can quickly learn and utilize new tech. This will provide a great way for potential employers to see how I handle wading into completely unfamiliar territory.

To do this, I’m using the Deno runtime instead of the Node.js runtime. I’ve never used any runtime other than Node for my backend or js first projects.

A benefit of Deno is that it supports typescript out of the box without any additional buildsteps. I’m a huge fan of this and it makes me much more likely to choose typescript as a tool for my personal projects.

In addition to the Deno runtime, the Deno foundation has released a brand new server-side rendering framework called Fresh. This framework is competing with the likes of Next.js and Sveltekit. It uses typescript and preact right out of the box.

I’m going to use these tools to create a basic social media website. My initial goal is to make a lightweight clone of Twitter, but the scope may change as I encounter difficulties or find better ways to implement features.

You can keep track of my progress using these repos:

Frontend Fresh server repo: click here
Backend REST api repo: click here

I’ve now written a few web apps in Go. My latest creation features Go on the backend using Gin as a lightweight web framework and gorm as my ORM. Gorm really surprised me with how easy it is to use. I still have a lot to learn about how it works, but it appears to manage migrations in a really intuitive way.

My database is PostgreSQL and it has been pretty easy to use. I just spin up a docker container with Postgres installed and connect to it with gorm.

On my front end is a Preact server that gets data from my back end through a REST api. I looked into GraphQL and it was pretty interesting, but has a decent learning curve and was not nearly as simple to implement.

For now, I’m working on authentication and exploring the ecosystem in Go. I would likely never roll my own auth in a production app, but going through the process of designing auth from scratch really helps me understand what all those third party libraries are doing anyway.

Sessions have been on the top of my list. My current goal is to make a Reddit style social media app that can scale to many users.

This is my tentative plan for now. As long as I design my front end and back end to be stateless, they should hopefully be able to handle arbitrary requests without knowledge of the previous ones. A caveat is session storage, but I can store session data in redis.

I may have to scale up the database layer too with multiple read only databases and a few write only databases, but I’m not 100% sure how to go about that yet. I’m not particularly experienced at scaling web applications to crazy amounts of users, but even this basic plan should ensure that I can use something like kubernetes and docker to scale the number of servers.