Vincent Ritter

🤓 Projects

Follow along as I build out product ideas with regular updates on progress, screenshots, thoughts on a particular way of doing things and so much more. This is at the heart of what I do and I love it.

Currently active projects:

These are my active development projects at this time. You can click/tap through any of them for more info and see specific posts for the project.

Picard

A server provisioning service for Ruby on Rails, Laravel and static based projects, with zero downtime deployments including your usual mix of common PHP CMS platforms like Craft CMS or Wordpress.

Find out more and read the updates

Status for updown.io

A simple app to display monitored sites from updown.io, with current status and other stats.

Find out more and read the updates

Launched projects:

These projects have been launched and are live 🚀 I continue to work on them and, as anything, they are never truly finished.

Gluon for Micro.blog

An app for both iOS and Android, built on React Native, for Micro.blog.

Find out more and read the updates

Simple Schedule

A new and simple way to manage bookings, appointments and gatherings on the web.

Find out more and read the updates

Recent posts

Picard.sh Project Diary - The Registration process

It's totally been overdue, but here I am with an update on Picard.

I'm not going to lie, I let this slide a bit after some pressure on getting Gluon out the door and a fair amount of client projects. So, here I am with some progress.

Let's get to it.

The registration process

I spent some time, over the weekend, to work on the registration process. There were a few screens designed already, but they had zero functionality.

The database design was already complete from my past self so all I had to do was write the code and make it work.

It's not complete yet, however it surely is getting there.

Registration is always weird and everyone does it differently. For Picard I wanted something that was quick to get in to, yet be safe to you. Managing your own servers can be tricky and using a third-party, like Picard, sure makes life easier.

However, with convenience comes responsibility.

When you're running a server that usually means you also keep personal information on it. That means that you should stay secure from sign up to deployment. As Picard acts as a front end to all your servers, I don't just want to allow the user to set any password they wish and be done with it. That just opens up headaches with keeping your account secure.

With that in mind, here is the flow of registration I have in mind:

The first two are easy, just set an email and then set your name. For email signup, during the beta, it will check if you have pre-registered or not. Only valid emails and pre-registration tokens can be used during pre-registration. You will get an email with that once I send out the first invites. If you want to set a different email during that process, you're more than welcome to.

Here is a screenshot:

Easy enough to get your started. Not shown is some extra text in the description, when using a pre-register invite link, saying that a different email can be used. You can see a screenshot of that here.

Next up is the Name field, keeping it simple:

This is just to keep it all nice and human. That name can be anything that means something to you. Your actual name is a good start. It will play a role later on. It's a mandatory step.

To note, all data is encrypted in the database, here is a preview from my local machine:

Note that my local, staging and production database all have different encryption keys.

Once that is set, we come to the password selection screen. This is slightly different than what you're used to normally, and I give you a choice of what you want to do.

Two options:

Personally I prefer magic links, but I totally see the need to set your own too. So here I give you an option.

Magic links

If you choose magic links for log-in, you will receive a link via email every time you want to log into Picard. A great side effect here is that you will never know your password... and it constantly changes - so it's never the same.

Password

Some of you prefer to set your own password, and I totally get it! In this case, you will go ahead and enter your own password during registration. Here I am planning to also check if the password hasn't been pwned before and if it's secure. That means I'll check the database at Have I Been Pwned before allowing you to proceed. 1Password also uses this feature to check against "pwned" passwords. To note, the password is never sent to Have I Been Pwned.

On top of setting a password, you will have to enable OTP auth at this stage. This is mandatory when using your own password.

This might sound like a headache... sure, however your and my safety is more important to me.

Of course, nothing ever is totally safe. However we can go some way to make it harder to gain unauthorised access to your account and servers.

More auth options

This hasn't built yet, however I am also planning to add OTP auth for magic links for extra security. This isn't mandatory at the start, but can be set later on in settings.

On top of this, I am also researching the use of WebAuthn. Which basically allows you to use security keys and other methods for authentication where supported.

Back to the registration process

So now that we have the lowdown on options, here is a screenshot of the password preference screen:

I highlight the magic links, as they're convenient. Gently nudging you in that direction. Depending on what you select, you'll go to the next steps. Which are yet to come.

One note on registration, once you entered your email and advanced to the next step you're already logged into the account automatically. So if you decide to leave and come back later, you will be redirect to the correct registration process. So I'll double check which step you're at and redirect as needed.

Next steps

That's as far as I got over the weekend. It's been fun working on it so far. It's also fun to work on the frontend and backend at the same time, which is a nice flow. With Simple Schedule I built out the frontend first and then the backend. This worked fine and gave me a clickable prototype... however it also introduced wasted work for features that didn't make it.

For this week I am planning on finishing the registration process for both magic links and password setting. I'll probably also then work on the login part.

That's it for now.

Spent a few hours working on Picard.sh today. Felt good. Going to do a small write up tomorrow about it.

Just working on database design. Nice to do something a little different.

Now to come up with, and create, the User table… pen and paper are not doing the trick so far. Gonna head for the shower and drink some herbal tea instead.

Here is my super simple take on the registration page for Picard. It has a bit of extra text when you’re coming in from an invite. I want to keep it simple without headaches. Password can be created later, if so desired.

Added the ability to send a registration invite for Picard, which you’ll need in order to register before the public launch. Seems to work nicely. Also have an ENV variable to toggle if it’s open for public.

When I push the button in the admin it will create a token and trigger an email with a special link. Trying to register without the correct details will boot you back to the homepage:

With that, I’m starting the registration screen:

I kinda dig the stars, so I’ll leave them for now. Not sure how to tackle the logged in area yet from a design point… we’ll see.

I worked on a super simple admin area for Picard last night. Just so I can handle any requests coming in, like deletion or Marketing preference changes. Also added the ability to re-send all pending/non-confirmed invites on a one time basis.

The screenshot is my local instance and you can see a few things, for example if they confirmed their email. When they pre-register it sends out an automatic email so they can verify it. If they didn’t I have the ability to send “All pending invites” again, however I can only do it once per email - I want to avoid spam - and also added some extra text to the email template stating exactly that. I could automate this on a weekly basis perhaps, but this will do for now and will come in handy when I’m ready to open it up. Other options include marketing preference toggle - easy enough - and the delete button.

The data in the database is encrypted so I had to find a way to do something quickly, as the database won’t tell me much except encrypted garbage.

Anyway, this was a bit of fun for me and probably not really necessary… However I can build on top of this and add new features as I go.

Next up for today I will work on Login and Register. Will post an update when I can.

Introducing Project Picard, my next code challenge aimed at developers that run their own servers.

Every month I spend more money just to manage my servers and apps than actually running them. Having multiple providers to manage different projects and frameworks isn't great. I want a solution that is fair, doesn't have limits - like the amount of servers - and ticks a few essential boxes with flexibility.

If you’re a freelancer or a small time dev, running your own servers, and using multiple frameworks you know that you usually have to jump through hoops to get everything up and running. Not to mention using different providers for your specific use case or framework.

This is my exact problem right now, in fact it has been like this for years! I run PHP projects (namely CMS’s), Ruby based projects (Rails) and an army of static websites from basic HTML to one-page JS apps built with Jekyll, React and others.

At best you can combine several providers to get the job done for you. I’m a visual person and also like things to be easy, so having a web app that can manage my servers is an absolute life saver. As a freelancer I don’t want to mess around with server configuration.

However, here is the rub… these services usually cost a hefty amount each month, they oppose limits to how many servers you can run on a price plan and, in most cases, limit what you can run on the servers without having to actually SSH into your server.

Don’t get me wrong, I think it’s good that a tool exists for a specific toolset and I’m very grateful that they exist today and make it easier to run my day to day operations with ease.

I’m looking at combining the best of all worlds in one service, to satisfy my own needs right now. Not only that, I also want to learn much more about server set up. I already have a good understanding of it all, however I really want to dig into the bare metal of it all to truly appreciate it. Not only that, I also want to learn how to take this knowledge and combine it with a web app.

Life is busy as it is, so if I can work on something that replaces two or even three providers with one then that’s good in my book. Not only that, technically, I’ll be reducing my own monthly outgoings for managing the servers to zero. I totally understand that I need to run the infrastructure for this, but I could in theory spin up 10 basic Linode boxes ($5/month) and still come in way under what I spend now on other server management services.

So this is project Picard - a server provisioning service for Ruby on Rails, Laravel and static based projects, with zero downtime deployments. Which, of course, will include your usual mix of common PHP CMS platforms like Craft CMS or Wordpress.

A blogging series and perhaps a podcast

Like with my other challenges, I’ll be regularly blogging about the build and will also be opening up on what exact features I have in mind as time goes. I don’t want to spill the beans straight away.

I’m thinking of also doing a small micro-cast as I go for a few things. It’s a bit different for me, but I’d love to try at least. Get my voice out there. Always weird to see someone write but not know what they sound like.

Pre-register

So, getting to it… I have created a pre-registration page where you can sign up to be notified when it’s ready to launch. I took great care to make sure your data is encrypted. I can’t be PCI compliant, as I’m only one person, but I’ll try and stick to this as close as possible. Everything will be encrypted and I take security and privacy seriously. During sign up, you can also let me know if you’re interested in general updates that I will email out. You don’t have to if you don’t want to. I’m building my very own mailer for this, so no third party reliance here.

When I’m ready, I’ll be inviting a few people to help me test (if you’re interested of course).

I’ll share the link at the end of the post, however first you get to see a nice screenshot of the holding page:

OMG… THIS LOOKS LIKE A KID MADE IT! So what? I think most web apps and service try to be way too serious these days! I want to bring back a bit of fun and character. Just like most cars today… they look totally mean like they’re going to beat you up. So, I want to have a bit of fun and inject a bit of life and colour into it… whilst being extremely useful at the same time.

BUT WHAT ABOUT SERVERLESS?

Good question. It’s cool stuff, but there are still many people that just want to run a simple server and get their stuff running the tried and tested way. I totally recognise this need for serverless, but deep down I think it’s another way to put off new-comers into the world of development. So here I am trying to find a balance of usefulness and ease of use without breaking your and my head. If I ever go that route I will probably explore that.

Timelines

This project has just started and will be a rough 3 month project for me. Well, I’m giving myself 3 months for a basic, but feature rich, web application.

I already have pre-registration finished and am currently working on implementing a backend to help me manage mailing and other tools like inviting a batch of people for testing. It’s not at the top of my priority list, but it will play a good role later on in the project.

Next thing after that I’ll work on registration and login and promoting pre-registered users to a full account.

I always like to work from outside to in. So I work on it step by step like a normal person would use it.

Instead of writing the frontend first in a separate app, I’m actually going to be building the frontend straight into the app, so I don’t have to copy anything across at a later stage… because things always change as you write the actual code. This should make it a bit faster for me.

Of course, as I said, I’ll be blogging about pretty much everything again - so that’s gonna be fun for me.

Make it so!

Here is the website you can pre-register on: picard.sh.

If there are any problems, just let me know straight away. You’ll have to confirm your email in order to receive an invite email once it’s ready and the occasional update. If you don’t then I won’t email anything, just to avoid fake sign ups (it happens people!).

Anyway, I’m SUPER happy I took time to write this and announce it. I’ll be announcing specific features and pricing as we get closer, but feel free to send suggestions if you think this will be of use to you (S3 backups out the box, Python and node projects… just to give you some totally random ideas here).

So I’ve deployed the Picard pre-registration page to the server yesterday. Tested it. Happy with it. Made a few tweaks today and deployed those. Now I just need to write the blog post to announce it.

I’ve slowly been working on Picard. Worked on the sign up process styling and also encryption of data.

Here is the UI after you put in your email address:

And once you verify:

Not too pretty, but it will do.

Blog post soon with announcement 🖖