How I migrated from PHP to Vuepress 2 (Part I)
How I migrated from PHP to Vuepress 2 (Part I)
It's been 3 years since my last post here. I have been busy with my work and other projects. The new focus I want to give to the blog is going to be a bit different. Less Raspberry Pi (I will tell why later) and more technical.
I want to share with you a series of articles about how has been the experience of migrating a blog made in PHP + MySQL, to a static one using Vuepress 2.
Before and now
Info
If you prefer, you can read this post at Medium: How I migrated from PHP to Vuepress 2 (Part I)
This isn't the first time I've changed my design. I don't remember when was the last time I did it, but it was a radical change (I have to look for a picture of the first version of the blog). The change at the time I did it mainly to be responsive (gosh, even the pages didn't need it that much!), to be able to use markdown and put some Javascript plug-ins to zoom the images and syntax highlighting in the source code it showed.
The technology in this aspect, has not changed too much. We still rely on Javascript on the client side and use it more than many Javascript haters would like (JQuery has gone into Beta with version 4!).
I'm going to put all my effort into making your visit to the blog as pleasant as possible. As you can see in your ad blocker, I have no advertising except on the main page at the end. About advertising, I don't like it and I don't want it to bother you. If you like what you read, you can invite me to a coffee ☕. That's it.
As you have seen in the screenshot of the previous blog, the design was very simple and I didn't change it over the years. I'm not particularly eager to change for the sake of changing. If something works, don't touch it. But as you can see, many things stopped working with the PHP updates imposed by my hosting, and I didn't have time to keep changing the code. So I decided to change technology now that I have time. The blog is still functional and accessible through the URL https://misapuntesde.com/index.php, but many things will not work as they should.
The technologies I used in the previous version were: PHP, MySQL, HTML + CSS, JS, jQuery, prism, zepto, picomodal, php-rss-writer, raintpl as template engine in PHP and PHP Markdown. The reason why I chose each one I don't know, maybe was the best solution that fit my needs at that moment.
As you can see if you are curious, some of the technologies used in the previous version, are obsolete and have been discontinued. It was time to move on to something more modern & fancy. What I am most proud of is that have created my blog from scratch using PHP in five days, without Frameworks, and that has worked for 10 years. Not a great achievement, but I'm proud of it. 😄
Vuepress 2
This is when Vuepress 2 comes in on this new version of the blog, which uses Vue 3 with Markdown. You can use Javascript or Typescript if you prefer. At first, I chose Vitepress, but It didn't have a good system for creating blogs, and I discarded it mostly because of the pagination, which it doesn't have when I write these words. That's when I started reading the documentation of Vuepress 2 and I was convinced. I don't know where I read the analogy that Vuepress is like Laravel and Vitepress is like its little brother Lumen.
The Vuepress documentation is very good, the community is growing and it allows you to create a static blog with a modern design in no time, which was what I needed. As I'm not good at front-end, the theme I chose came in handy and it has everything and more for what I need: I'm talking about the theme Hope.
The only thing that makes me angry is that I, being an artisan developer who likes to do things almost from scratch, I have chosen to use a theme that gives you almost everything done. But that's what I needed. I don't have time to do a design from scratch, and I want to focus on what I do best: writing and programming.
TODO
As you can see, it hasn't been easy. I've had to do a lot of things to get the blog the way you see it now. And I still have a lot left to do. Some of the things I have pending are:
- Change hosting: Now I'm with Ionos and I don't want to change now because I have a lot of files that I use in PiKISS and I will have to look for hosting for it. I also want to experiment something with free hostings for static content, like Netlify, Vercel or GitHub Pages.
- Add comments: I like Discus and I think I'll stick with it. I've seen a plug-in for Vuepress that allows it.
- Visitor counter: I don't like it, but I'd like to know if someone reads what I write.
- ...
Of course, if you like development as much as I do, I'll tell you in successive articles what I have done and how I'm implementing these new features and improvements in the blog.
Well, it's about time I tell you how the migration process has been, isn't it? But, wait a minute... this article is already too long, is it ok if we leave the technical part for future articles? Oh, no, you came here to know all the riddles and all the work? Well, you'll have to put up with it a little bit. 😄
See you in the next article! 🚀