21 votes

Advice for hosting (and building) a personal website

Hey all! I've been thinking about buying a domain and building a personal website for myself -- at this point just a personal website with links to my socials, my CV, maybe any interesting projects I want to publicize. Maybe someday I'll decide I want to add a blog or build a webapp or something, but for now it'll be something simple and static.

My programming experience is very much not in the frontend side of things (I'm a data scientist and mostly use python day-to-day). I played around with HTML messing with my Tumblr theme enough back in the day that I'm reasonably sure I can build something solidly web 1.0, and I've toyed with stuff like Jekyll in the past. But I was wondering if I could use this as an opportunity to build up some basic skills that I could put on my resume for the future. But I have no idea what's out there that would be useful and quick to learn but wouldn't be massive overkill for a project like this.

I also have no idea how web-hosting works and who to go with if I want to build a personal website myself rather than relying on something like Wix or Wordpress. Most of the easily-Google-able advice is for different use-cases. Advice is either people who want something user-friendly with minimal coding like Wordpress or it's for something properly big and commercial, neither of which is me.

Anyway, I know we've got a lot of suitably tech-y people here on Tildes, so I'm hoping people here have good advice for this sort of use case. Thanks!

31 comments

  1. [3]
    chopin
    Link
    I'd recommend GitHub Pages for free hosting. That's where I host my personal website (just HTML, CSS, and a bit of JS). It handles SSL for you and updates automatically on code pushes but keep in...

    I'd recommend GitHub Pages for free hosting. That's where I host my personal website (just HTML, CSS, and a bit of JS).

    It handles SSL for you and updates automatically on code pushes but keep in mind that the free version requires your GitHub repo to be public.

    9 votes
    1. [2]
      pyeri
      Link Parent
      The best thing about github pages is that it supports jekyll out of the box! I never write my blog posts in html, I write the markdown files and github actions automatically generates the blog...

      The best thing about github pages is that it supports jekyll out of the box! I never write my blog posts in html, I write the markdown files and github actions automatically generates the blog from the configuration. This makes it as useful as something like Wodpress as you can literally edit the *.md posts even through your mobile browser and have your blog updated on the go.

      1. chopin
        Link Parent
        That's awesome. I had my blogs on hashnode, but I think I'll just do it your way. Thanks!

        That's awesome. I had my blogs on hashnode, but I think I'll just do it your way. Thanks!

        1 vote
  2. [3]
    Eabryt
    Link
    Man my favorite thing about Tildes is how often someone is asking the same questions I've been thinking about recently. Following this closely. I've just moved to a new town and after finding it...

    Man my favorite thing about Tildes is how often someone is asking the same questions I've been thinking about recently.

    Following this closely. I've just moved to a new town and after finding it impossible to get good information about the local elections and candidate, I'm thinking about putting together a website where I can compile everything together for anyone who wants it.

    9 votes
    1. [2]
      RheingoldRiver
      Link Parent
      I would open a wiki on Miraheze - they'll host you for free with no ads and you can make wiki pages about the candidates which everyone can edit. Normally Miraheze closes down wikis that arent...

      I would open a wiki on Miraheze - they'll host you for free with no ads and you can make wiki pages about the candidates which everyone can edit. Normally Miraheze closes down wikis that arent edited for some amount of time (30 days?) but you might be able to get them to make an exception for you if you want to post yearly election information as that would probably qualify as a recurring-event wiki

      (disclosure I work for another wiki hosting site, but miraheze is the best option for this, no affiliation with them particularly but i love mediawiki)

      2 votes
      1. Eabryt
        Link Parent
        Oh that's neat. I'm not sure I love the idea of everyone being able to edit though, I'll have to mess around with it. Ideally my plan is for it to be a non-partisan source. I'm hoping it'll also...

        Oh that's neat.

        I'm not sure I love the idea of everyone being able to edit though, I'll have to mess around with it. Ideally my plan is for it to be a non-partisan source. I'm hoping it'll also help me get more involved in what's going on in my town.

        2 votes
  3. [8]
    RheingoldRiver
    (edited )
    Link
    I use Hugo for my personal blog. If I were to do it over again I don't think I would make this same choice, I'd use Gatsby; but Hugo is very simple and friendly and you don't need any FE...

    I use Hugo for my personal blog. If I were to do it over again I don't think I would make this same choice, I'd use Gatsby; but Hugo is very simple and friendly and you don't need any FE (frontend) at all, you just pick and install a theme.

    The reason I wish I had Gatsby now is so I could write React components to make interactive demos, so if you don't want to do any FE development I have nothing bad to say against Hugo.

    7 votes
    1. [4]
      sparksbet
      Link Parent
      Hugo's themes look nice but I think it's more or less the opposite of what I'm looking for in this particular instance -- I want something that's more hands-on and involves me building/customizing...

      Hugo's themes look nice but I think it's more or less the opposite of what I'm looking for in this particular instance -- I want something that's more hands-on and involves me building/customizing things myself to learn a bit of FE. It does look handy though, so I'll keep it in mind for the future if it ends up suiting something.

      3 votes
      1. Wes
        Link Parent
        Honestly I think you'd be happiest just building a plain old HTML website. No need for a static site generator, database, or anything complex. Just write the markup and styles yourself, throw it...

        Honestly I think you'd be happiest just building a plain old HTML website. No need for a static site generator, database, or anything complex. Just write the markup and styles yourself, throw it up on GitHub Pages or Netlify and point a domain at it. There's your website.

        If you want to add a blog or more dynamic functionality in the future, you can always apply those skills to something new. But it's never a bad choice to start with the basics.

        8 votes
      2. RheingoldRiver
        Link Parent
        TBH imo "having a personal site possibly a blog" and "having a site you can tinker on" are opposite goals. For a personal site / blog, the most important thing is that writing is easy. If writing...

        TBH imo "having a personal site possibly a blog" and "having a site you can tinker on" are opposite goals. For a personal site / blog, the most important thing is that writing is easy. If writing isn't easy you'll lose motivation to write every time you encounter the not-easy parts.

        I'd recommend finding some specific project you want to build and hosting it with github pages, making a simple site with hugo or another framework as your personal-site-and-perhaps-later-a-blog, and then linking from your personal site to all your projects. You can do individual projects pretty easily with subdomains, e.g. my-project.example.com will be treated as a root domain exactly the same way as example.com would, you just have to set up the right type of record with your registrar (I recommend NameCheap for that btw)

        6 votes
      3. 0xSim
        Link Parent
        I mentioned it yesterday in another post: I'm using Quartz + Obsidian for my own site. Quartz could be the hands-on experience you want: since you need to fork the repo to create your own site,...

        I mentioned it yesterday in another post: I'm using Quartz + Obsidian for my own site.

        Quartz could be the hands-on experience you want: since you need to fork the repo to create your own site, the full code is readily available for changes.

        4 votes
    2. [3]
      riQQ
      Link Parent
      FE = frontend, right? Took me some time to guess.

      FE = frontend, right? Took me some time to guess.

      1 vote
      1. [2]
        RheingoldRiver
        Link Parent
        ah yeah sorry

        ah yeah sorry

        1 vote
        1. riQQ
          (edited )
          Link Parent
          No worries, I mainly posted this for future readers.

          No worries, I mainly posted this for future readers.

  4. [2]
    eddielomax
    Link
    Github pages is free and straightforward: https://docs.github.com/en/pages/quickstart render.com has free hosting for static sites including CDN that just pulls content from github.com/your-repo...

    Github pages is free and straightforward:
    https://docs.github.com/en/pages/quickstart

    render.com has free hosting for static sites including CDN that just pulls content from github.com/your-repo or wherever you want to store your static files, and they can also do a bunch of other stuff:
    https://docs.render.com/static-sites

    6 votes
    1. IsildursBane
      Link Parent
      With Github pages, you can make development easier if you want to do a simple site by using Bootstrap and Bootswatch as well. Then the only thing that you would have to pay for is your custom...

      With Github pages, you can make development easier if you want to do a simple site by using Bootstrap and Bootswatch as well. Then the only thing that you would have to pay for is your custom domain which can be pretty cheap

      2 votes
  5. Rudism
    (edited )
    Link
    At the bare minimum, to host a static website, you need these things: The html files, css, images, and whatever other content you want to serve. You can create these manually, use a static site...
    • Exemplary

    At the bare minimum, to host a static website, you need these things:

    • The html files, css, images, and whatever other content you want to serve. You can create these manually, use a static site generator to create them out of themes/templates/etc, pay someone to create them for you--lots of options here. Sounds like you might be happiest just manually creating and editing the files to start with. Typically with a static website you can simply use your browser to open your HTML files locally to see what it looks like and make changes and updates until you're happy with it.

    • A web host to serve the files. Again you have a lot of choices, from something simple like paying a static site host (which can be found for fairly cheap, maybe a couple bucks a month), to something more complex like using Amazon's S3 and Cloudfront services, or renting a virtual private server (VPS) and SSHing in to configure the web server and other software required to turn it into something that can host a website. Depending on how much you want to learn about how the sausage is made, you might want to lean towards the former option.

    • Some way to get your website files onto that server. If you're paying for a hosting service they'll probably give you SSH/SFTP access, an FTP server, or on the simpler end of the spectrum maybe a web-based portal to upload your files. Again there are probably a lot of options out there so you can evaluate some of them and find something that you're comfortable with.

    • A domain name to point to your website. The host or VPS or Cloudfront instance (or whatever you end up going with) will probably either give you an IP address for the server where the files that you've uploaded are being served, and you need to use the tools provided by the registrar where you registered the domain to point the domain to that IP address; or they'll give you the addresses of their own nameservers that you can assign to your domain in order for them to connect it to your website for you, which again you'd do through the tools provided by the registrar where you registered the domain to set those name servers.

    • Edited to add, these days you also want an SSL certificate so you can serve your site via https instead of just http. Ideally the website host you choose can do this for you for free, but if not it can add another layer of complexity to deal with so it's something to keep in mind. I haven't looked around much, but I think if any host doesn't offer SSL/secure hosting by default in all their plans (like if it's an up-sell that you have to pay extra for) then to me that would be a strong indicator that you should look for a different host.

    4 votes
  6. devilized
    Link
    As others have mentioned, Github Pages is nice for static websites. My personal site does have some components that necessitated a server-side backend, so I hosted it as a serverless app using the...

    As others have mentioned, Github Pages is nice for static websites. My personal site does have some components that necessitated a server-side backend, so I hosted it as a serverless app using the "app engine" on Google Cloud. They bill be $0.01 for it every month. I think AWS has a version of this as well.

    5 votes
  7. Englerdy
    Link
    These suggestions may not align with what you're trying to do if you really want to build up from scratch (I can't quite tell), so offering them in case they're interesting to you. WordPress is a...

    These suggestions may not align with what you're trying to do if you really want to build up from scratch (I can't quite tell), so offering them in case they're interesting to you.

    WordPress is a pretty viable way to get something up and off the ground quickly. You can self host it where ever you want and it does come with a lot of flexibility. It's certainly going to be as performance optimized as something built from scratch, but you can choose themes and plugins that are lightweight and allow for something that looks good on mobile and desktop pretty fast.

    Since you're a python coder, you may also find something like NiceGUI an option as well. It's relatively new for Python GUI libraries, however the developers have been extremely active and features have rolled out really fast over the last year. It gives you a very pythonic way to structure a website/app while giving you easy access to HTML and CSS manipulation of the elements to style them. Their website is made with NiceGUI as an example.

    Not sure if either of these are what you're after, but both offer alternative approaches to consider.

    2 votes
  8. ackables
    Link
    If you use obsidian for taking notes or organizing information, you can publish all or part of those into a wiki on the internet.

    If you use obsidian for taking notes or organizing information, you can publish all or part of those into a wiki on the internet.

    2 votes
  9. unkz
    Link
    If you're already a Python developer, I gotta recommend Django+Wagtail. Easily the most powerful framework available at the moment, with a pretty easy learning curve. As a bonus, particularly as a...

    If you're already a Python developer, I gotta recommend Django+Wagtail. Easily the most powerful framework available at the moment, with a pretty easy learning curve. As a bonus, particularly as a data science person, I've found Django+celery background tasks to be invaluable as a productivity tool for building development interfaces for day to day mlops work.

    2 votes
  10. cstby
    Link
    If you want to build a personal webpage, check out al-folio, a Jekyll theme. You can deploy it on GitHub pages, but Cloudflare pages is also a great free option. I'd recommend separating out your...

    If you want to build a personal webpage, check out al-folio, a Jekyll theme. You can deploy it on GitHub pages, but Cloudflare pages is also a great free option.

    I'd recommend separating out your goals of building a personal website and learning front-end dev. Franky, you aren't going to learn much about frontend engineering by building a personal static site.

    2 votes
  11. fxgn
    Link
    If you want a blog, you should use a static site generator. Astro and Hugo are my favorite ones. It's a bit harder to write a custom theme for Hugo (and it's harder to customize in general), but...

    If you want a blog, you should use a static site generator. Astro and Hugo are my favorite ones. It's a bit harder to write a custom theme for Hugo (and it's harder to customize in general), but it's specifically made for blogs, so after you set it up, it'll be super simple to write posts (but it super easy to add a blogging module to Astro as well). They're both awesome though.

    Otherwise, you can just use plain HTML/CSS, or again, use Astro if you want to make your life easier with re-usable components etc. Astro is currently my go-to tool for making static sites.

    (Don't let the "JavaScript framework" stuff on Astro's website scare you - it's written in JavaScript, but it by default compiles to a completely static site without any JS)

    For hosting, GitHub Pages and Cloudflare Pages are awesome free options. Cloudflare offers more control and I've generally had a slightly better experience with it, but GH Pages is awesome as well.

    2 votes
  12. kingofsnake
    Link
    Does anyone still use WordPress? I love the theme variety, function options and vast library of plugins. It's not 2015 anymore, but if paired with a hosting plan, it's worth a look.

    Does anyone still use WordPress? I love the theme variety, function options and vast library of plugins.

    It's not 2015 anymore, but if paired with a hosting plan, it's worth a look.

    1 vote
  13. bkimmel
    Link
    How much do you really want to do or learn Frontend development? That's not a facetious question. I would say make your decision along this rubric: 1. "I want to make a website that looks like it...

    How much do you really want to do or learn Frontend development? That's not a facetious question. I would say make your decision along this rubric: 1. "I want to make a website that looks like it was done by a professional and presents my ideas in a respectable way". Just get a Squarespace site. 2. "I want to learn Frontend development". Then use something like what's suggested elsewhere (GitHub pages,etc.)

    1 vote
  14. pyeri
    Link
    A bit late to the party. I use github pages for hosting my static blog. It's the best of all worlds if you're looking for something like this, no need of bothering with domains and hosting (gh...

    A bit late to the party.

    I use github pages for hosting my static blog. It's the best of all worlds if you're looking for something like this, no need of bothering with domains and hosting (gh provides you one), it supports jekyll out of the box and above all, it's gratis.

    With Wordpress, either you will have to self-host with Wordpress.org (domains, hosting and other botherations) or you host it on Wordpress.com which comes with several restrictions (you can't use adsense on your blog, for example).

    The downside of github.io is that it won't give you a nice tardy dashboard like Wordpress, you need to muster up the programmer you are and configure the jekyll files, write posts in markdown and then push the whole thing to a github repo. Not much of a rocket science, of course, but non-programmers are often too lazy to do this errand.

    1 vote
  15. [2]
    umlautsuser123
    (edited )
    Link
    I could have written this post myself a few months ago! I've been learning it on and off, and am at the point of now buying a domain and connecting it to my site. I think the feedback on "if you...

    I could have written this post myself a few months ago! I've been learning it on and off, and am at the point of now buying a domain and connecting it to my site. I think the feedback on "if you want to blog, just go for something super simple" is correct. But I wanted to learn / get more comfortable in the rest of the stack, as a backend engineer. This is what I did:

    • Get comfy with Terraform. This wasn't needed and I wouldn't recommend doing this work unless you want to know it better (I wanted to learn infra)
      • Set up a remote TF state to carry project history and locks
      • Integrate GitHub Actions with AWS and Terraform so I can deploy via pipeline
    • Set up an s3 bucket for your static assets and a Cloudfront distribution to serve them. (Don't bother with WAF, from what I could tell it was so expensive I'd need ungodly levels of traffic for it to make sense for me as an individual.)
    • Go through the official Astro JS materials. They have a GitHub actions snippet to deploy to AWS (as well as other outlets), and their basic tutorial is all about setting up a blog. You can do the first part then just keep on dumping markdown files in the directory, easy peasy.

    My next steps are buying a domain on Porkbun (got the rec from this thread), routing the domain to my Cloudfront distribution, and overengineering a drafting UI.

    I did save a bunch of guides / tutorials I could dig up, if that's helpful. But I think I mostly needed them to better understand doing things in Terraform. Feel free to DM me or message here if you have specific questions or would want any help debugging something :)

    1 vote
    1. sparksbet
      Link Parent
      Ooh, this is definitely overkill for what I need right now but I'm saving this for later on bc this does sound more like the sort of things the devs at my work use for actual web dev, so it would...

      Ooh, this is definitely overkill for what I need right now but I'm saving this for later on bc this does sound more like the sort of things the devs at my work use for actual web dev, so it would be useful to try to use it for a project where it would make more sense.

  16. [3]
    zenen
    Link
    Oh yay! This is something of a personal passion of mine. If you're not afraid of digging your hands into the terminal a bit, You can get a really solid personal page going with a folder of...

    Oh yay! This is something of a personal passion of mine. If you're not afraid of digging your hands into the terminal a bit, You can get a really solid personal page going with a folder of HTML/CSS/JS and a basic webserver configuration (I generally default to NGINX).

    Configuring NGINX in detail would probably be out of scope, but learning to set up a basic VPS (DigitalOcean works) and copying files to and from it with 'scp' is a useful skill with immediate practical benefits (e.g. you can upload a file to your server whenever you want to share something with someone)

    1. [2]
      sparksbet
      Link Parent
      I've used scp before for non-webdev stuff (though at the time I was using a windows machine rather than linux, so it came with a bunch of extra complications due to that). I think a setup like...

      I've used scp before for non-webdev stuff (though at the time I was using a windows machine rather than linux, so it came with a bunch of extra complications due to that). I think a setup like this would be potentially appealing to me. Is there anything in particular you'd recommend for someone getting started? Any pitfalls you'd suggest avoiding?

      1. zenen
        Link Parent
        I don't have the time to get into it right this moment, but I'm building a Python-based framework that fits your use case fairly accurately. I'll try to come back to this in the near future, but...

        I don't have the time to get into it right this moment, but I'm building a Python-based framework that fits your use case fairly accurately. I'll try to come back to this in the near future, but in the mean time I'd suggest staying away from any tools that strays too far from composing your website in regular HTML and CSS. Website builders are easy, but they thrive on obfuscating details that you need to gain proper mastery of your site.

        1 vote