DEV Community

Jonathan Irvin
Jonathan Irvin

Posted on

Jelly Fin: A Little Bump & Grind 😉

Hey Jellies!

If the title of the article got your attention, congratulations! You're either a 90's kid, you've got a dirty mind or both!

Here's a quick update

We were initially focused on a mobile native app first, but have since switched postures to focus on a PWA with VueJS first for many reasons.

  1. Setup takes seconds. This reduces the mean-time-to-contribute. I don't know if that's a real thing, but I imagined a metric for the average time it would take someone to pull down the repo, make a change, and submit a PR. That would be it.
  2. Vue has a little of both when it comes to adopting from Angular and React. So if you have a background in either, you should be able to hop in easily.
  3. If you have no background in either, Vue has some of the best documentation out there. So, it should be easy to pick it up.
  4. DevOps is easier. I was able to very quickly get the project bootstrapped, setup Travis for automated builds and deployments, and other nifty things.

Something to think about

Take the thought out of it. Remove the mindless chores that your brain has to churn through and leave the fun stuff like choosing the color of your buttons and arguing over whether eggshell is the same as offwhite.

Tools I'm using

Travis CI or Continuous Integration is the process of using a tool that will test how your code behaves when you integrate new code into existing code. Does it break? Will it blend?

Dependabot automatically monitors my package.json file and checks for any updates that need to take place and will open a Pull Request which kicks off a Travis build and tests to make sure the dependency update doesn't break the app. Dependabot has a TON of settings you can do and would be an exhaustive article in itself. I discovered this when looking at the DEV codebase and adapted it for my own uses. One of the things I have my configuration setup for is automatic PR merges so I don't have to approve every PR manually for the tool to merge in the updates. During development this is great, but I'm sure as we get closer to our first release, we may scale this back.

Semantic Release is a really great tool that scans your Git commit history and will automatically bump the version of your app based off of the contents of your commit message. Here's an example. Doing it this way allows me to focus on my code and the tool will bump the version of my app and deploy a release with release notes so I can focus on my code and less on chores.

Commitizen and CZ-Conventional-Changelog is a system such that while you can adhere to the formatting that Semantic Release needs to automatically bump the version, why not use a tool to handle that, too? That's exactly what Commitizen does and CZ-Conventional-Changelog is a plugin for that.

From their README:

Commitizen is an open source project that helps contributors be good open source citizens. It accomplishes this by prompting them to follow commit message conventions at commit time. It also empowers project maintainers to create or use predefined commit message conventions in their repos to better communicate their expectations to potential contributors.

Firebase is a suite of apps from Google that we're using to handle our backend as well as hosting. I have my database stored here, user authentication, and even have the web app hosted here. Using a system like this is crucial because when you're just getting started, you either have too much or not enough resources. With Firebase, I know my app will be able to handle as much or as little traffic whenever the time comes and I don't have to fiddle with scaling up or down or monitoring for outages. And right now, I'm just floating well under their free tier so that's zero money out of pocket.

VueJS is my frontend framework. Love it or hate it, I chose this because it borrows from both Angular and React. I would have never been exposed to this if it weren't for a previous employer and I must say the documentation is super clean and the SETUP was a BREEZE! As you may have read before, I was struggling with just getting the React Native system up and running with all the nifty bells and whistles I had grown accustomed to. Well, VueJS knocks that out of the ball park. If you want a web app with simple setup and a super efficient CLI to boot, VueJS is awesome.

Prettier is one of my FAVORITE tools. It's an automatic code formatter. I use it precommit which means that before my code gets committed, it evaluates my code, cleans it up, and then commits it. The cost benefit to using something like this is that you can focus on writing the code and less on formatting the code. Also, people tend to have wildly varying developer setups and some people like ' vs ". Regardless of where you fall on that spectrum, prettier makes sure all code looks the same once it gets into the repository. Even if you're a messy code (and you all know who you are), prettier takes the thought out of it.

A Note from Me

We had a lot of initial interest and that has waned. I take responsibility for that for not creating a fertile environment for those of you who were interested in helping out. The setup was frustrating and this is a big factor in switching to focusing on web development first.

Another reason is after thinking about the core of Jelly Fin, we generally pay our bills on a desktop or laptop. So, it makes more sense to focus on a desktop version and then later on the native mobile application as the app matures and we understand the needs of our users better.

I'm working on some branding and will eventually setup a Patreon for those of you who may not want to contribute with code, but may want to pitch a dollar or two for the sake of a good idea.

Finally, thank you for all of the immense support from you all and especially @ben from the DEV team for listening to my ideas to help make this community a more fertile environment for people like me who have a dream of making an app for the sake of it.

Most Sincerely,
Jonathan Irvin

Top comments (0)