I’ve been away a while, So hello all my old friends!!!
So here is my question.
Is there either a opensource or if I need to, paid software that allows me to design a webpage “offline” locally before publishing to a remote server?
I’m looking for a hopefully mostly GUI based tool that allows importing pictures, videos, graphics etc., allows easy inclusion of links, and other interactive elements fairly easily.
Heres the application if you’d like to read more.
This is going to be my first venture into webdesign. My wife wants us to develope a page for a “business” (side baking business).
I’d like to do it ourselves because I hate the idea of a monthly fee for developing and hosting our page. Also, Id like a remote server to play with as a next step in my tech self development.
I know it would be “easier” to just pay but this is a side project to learn with no real time constraints.
Im open to difficult to use tools as I can handle a steep learning curve. Ill learn code if people think thats the best way, id just need a resource or book to learn it.
Linux, or windows is fine by me.
I think thats about all. I appreciate any and everyones opinions or experiences with this topic.
All you need for a “website” is really just a HTTP server and one HTML file. HTML documents refer to other files like CSS stylesheets, scripts for interactivity, images, fonts, etc. These days most HTML isn’t from just a static file though, it tends to be generated by server side code. About 75% of sites still run on PHP but you can use pretty much anything really. In addition most sites also rely on a database either mysql/mariadb, postgre, or sqlite but again there are no rules. As long a site conforms to web standards it’s all the same as far as browsers are concerned.
If you want to develop locally then the first thing you’ll need to setup are HTTP and database servers. If you want to build sites via a GUI then hosted solutions are probably the way to go but you can build these locally as well. If you want a website for anything more than your own personal use then you’ll have to pay for hosting at the very least regardless of how a site is built.
If you want to develop locally you can install XAMP which includes the needed HTTP and database servers in a single package along with PHP and some common tools. There’s a ton of different ways to build sites using this as a base and most web hosts will support the requirements of sites built on the base that XAMP provides.
If you want to go GUI then just get a host that supports automated installs of graphical site building software (most do with wordpress being the most common) and you’re off. Web hosts generally include guides or at least link to guides that apply to their services.
Yeah the plan is to buy space on a remote server, get the domain, cert the server so it can host the page for me so I dont have to do it in my home network.
Id just like to be able to play with it here at home, then shoot the updates to the remote server for hosting purposes.
Im looking at a remote server anyways to set up a wireguard server I can use while Im away from home, and a proxy server etc just for fun since Ill own the space. Let them worry about basic security for the server etc.
I prefer to work locally too. Instant page loads makes development more enjoyable and not having to worry about breaking stuff while working is often essential.
If you plan on setting up your own web host remotely then you may as well set one up locally first. XAMP is targeted for local development rather than production servers so I wouldn’t use it for production… I’m sure it can be hardened but I doubt the defaults are any good in terms of security or performance for production. You’ll want to take care to make sure your public setup is secure because your remote host can’t manage security for services you setup.
If you have pfsense or some other router which allows for custom local DNS entries, then you can set up a local domain for testing. Add to that a real certificate with certbot and your local dev site will work pretty much like any “real” site out on the public internet would, so yeah totally doable to host it all locally until you’re ready to push it out into the wild.
You can do that with host overrides and self signed certificates also, I personally just find that way annoying since you’ve got to tell everything that your certificate isn’t highly suspect.
This sounds like a good use case for a static website generator like Jekyll or Hugo. Workflow is simple - Just write the page in Markdown, run it through Jekyll, publish the result.
If you are looking more towards the design side of things, then you would want to look into Jekyll templates. Some CSS knowledge required but not exactly rocket science.*
Bonus points, Jekyll can probably also output to LaTeX and PDF / Print as the ideas are very similar, I have not looked into it though
*Complex CSS layouts can be a magnitude or two harder than rocket science, so dont sail in those waters. In general though, CSS is not hard, especially with a template engine.
The good thing about VS Code is that it can be a lightweight and flexible editor if configured properly, and the fundamental design ideas are spot on for the most part. Use what you need, not what someone think you should require. Maybe. Hopefully. Probably. Maybe not. (see for instance Visual Studio loading the TFS module because you might need TFS over git for one project one day)
The bad thing about VS Code is that the core is built on Electron which is one of the most inefficient ways to render a GUI app ever invented. Great to make something quick but not exactly performance oriented. This unfortunately shows once you need to, say, load the Linux kernel git into it. It is dog slow for that.
And of course, once you learn how to speak vi, using VS Code is like trying to run a marathon in flip flops - you can do it of course, but the vi emulator just isn’t good enough, VS Code make too many assumptions there.
Apart from that, VS Code is a good alternative if you really cannot vibe with Vi (vm, neovim, et cetera). And these days it beats the snot out of emacs.
Whoa, where have I been? Vi all grown up… Just took a look at the [Neovim] (https://neovim.io/) site, quite the progression from my well worn vi Editor Pocket Reference from O’Reilly so I can refresh my memory on how to ‘exit’ vi. 8 )
I would have never even glanced at Neovim if you didn’t mention it, Thanks!
As far as developing locally, I just setup a VM that will be a mirror copy of what will be on the server and use ssh to update the files, although I’m sure there is a much better way of doing things now.
For offline web design, try BlueGriffon or KompoZer (both open-source), or if you’re okay with paid, Pinegrow is awesome — GUI-based, runs locally, and great for learning real HTML/CSS.
