How to build a website without frameworks and tons of libraries • Hacker News Board

Re: How to build a website without frameworks and tons of libraries

#101

Post by fullstackchris » Tue, Jul 04, 2023, 9:39 PM UTC

Terretta wrote: post #95

spondylosaurus wrote: post #28

Earlier quoted context omitted.

For sure! I'm all in favor of bespoke new tools. If anything I'm just confused about the way they describe this in contrast to SSGs (and why a SSG wasn't a good option for them), and then go on to create a tool that literally generates a static site. :P Maybe I'm being obtuse, but the reasons they gave for not using an established SSG primed me to expect a radically new solution. Versus "we didn't like any existing S…

I'm with you. Jinja and watchdog.py taking somefile.src.html -> somefile.html feels a bit static-site-gen-ish.

[flagged]

Re: How to build a website without frameworks and tons of libraries

#102

Post by calvinmorrison » Tue, Jul 04, 2023, 9:41 PM UTC

fullstackchris wrote: post #99

> Mind you, Hetzner webhosting starts at 2 EUR! How crazy is that? Oh yeah? and netlify is totally free for an infinite amount of sites! how crazy is that? > We use a short Python script with exactly 45 lines of code. Including comments and blank lines. > > In summary, this is the simple toolchain for building our web: > > Developer updates index.src.html > Watchdog.py detects the file change and ... > ... renders Ji…

99% of developers are out her building with php, .net or Java and its fine

Re: How to build a website without frameworks and tons of libraries

#103

Post by roblh » Tue, Jul 04, 2023, 9:41 PM UTC

Alright, I’m gonna be that guy.

Right now, sveltekit + skeleton has absolutely blown my mind at how fast you can make a usable prototype. It’s honestly insane. You don’t even need to know svelte, really. As long as you can understand the file based routing thing, the rest is just html unless you really need more. Especially with the tailwind stuff built right in and a mostly vanilla looking theme.

I’ve tried probably a dozen different things in the last few months, ranging from Astro to Lit to NextJs to using the built in golang templating system, pug, eleventy, and more I’m forgetting. So far this is my favourite in just about every way.

Re: How to build a website without frameworks and tons of libraries

#104

Post by ukuina » Tue, Jul 04, 2023, 9:43 PM UTC

dimmke wrote: post #23

albertgoeswoof wrote: post #4

I took a similar approach building mailpace.com's marketing/landing site: https://blog.mailpace.com/blog/using-html-modules/ basically you just write in HTML, CSS and a wee bit of JS wherever you want it, and have a couple of tiny npm scripts that glue it together. Put it on netlify, cloudflare, github, or wherever and it scales right up. In comparison our blog is in Gatsby, and boy does that framework never seem to…

I genuinely believe Gatsby is the epitome of everything wrong with front-end development. It’s such a bad framework. So complex and confusing and fragile just to generate static pages.

Agree, when did simple template expansion go out of style?

Re: How to build a website without frameworks and tons of libraries

#105

Post by andai » Tue, Jul 04, 2023, 9:43 PM UTC

djbusby wrote: post #97

wizofaus wrote: post #75

Did anyone else notice the fact that on the home page, for any window width >= 1280px, the text "Your design. Our HTML and CSS" (in the body) overlaps the text in the footer (and is strangely hard to select for copying to the clipboard). In fact the footer tends to overlap the body at various window sizes. Can't help but think that you'd wanna at least get a simple thing like that right on such a page... Edit: I noti…

On my Chrome/Android I have the default font size larger. And sometimes HN loads with my preference - and others it loads tiny. No rhyme/reason.

On iOS Safari, sometimes the same element type on the same page will be different sizes (e.g. the navigation buttons on xkcd).

Re: How to build a website without frameworks and tons of libraries

#106

Post by divbzero » Tue, Jul 04, 2023, 9:45 PM UTC

michaelteter wrote: post #86

"as simple as possible but no simpler" - (not Albert Einstein, probably) Pure HTML + CSS, with the CSS in the or inline in each html tag... this is a fine way to get something going. And then when you have two pages, you pull the CSS out to a separate file. But once you start making any site which has multiple pages of the same format, you want some kind of template system with includes and a (static page) generator.…

Yes, even OP ends up using two libraries: Jinja for templating and Tailwind for styling. It’s the happy medium, as you say, between bare HTML + CSS and full-blown Django/Phoenix/Rails + Angular/React/Vue.

Re: How to build a website without frameworks and tons of libraries

#107

Post by [deleted] » Tue, Jul 04, 2023, 9:45 PM UTC

[deleted]

Re: How to build a website without frameworks and tons of libraries

#108

Post by lionkor » Tue, Jul 04, 2023, 9:46 PM UTC

I've found a combination of picocss (or similar), a webserver with some templating (like handlebars) and as much server side rendering as possible pretty simple, and pretty easy to use, so far.

For example, one could use rust with some webserver and handlebars-rs to do this. You can add databases to this, and whatever else you need, and it works nicely. If you want to change anything, its very vanilla html, css, javascript, or rust/c++/nodejs/whatever else.

No new frameworks to learn, and you decide the structure.

Re: How to build a website without frameworks and tons of libraries

#109

Post by ad404b8a372f2b9 » Tue, Jul 04, 2023, 9:47 PM UTC

djbusby wrote: post #43

ad404b8a372f2b9 wrote: post #16

Fancy that! HTML and CSS? To make a Website? They must be mad! All joking aside, I use the same stack save for the templating. Unless you are a web developer I don't see the point of a CSS framework, it's much easier to roll your own. Nor of a site generator, I tried Hugo it saved no time at all. Nor of JavaScript, a few months ago I tried replicating the websites of a few companies to improve my css skills, HTML and…

I find it very hard to design. And then design consistently. So, I love some CSS that has that pre-defined. Otherwise my looks like heck.

I see your point. My recommendation if you wish to improve your designs is to do them outside of CSS if you don't already. With something like figma or Penpot you will have your fonts, palette, spacing and layout all predefined.

Then once all your views are created using these common elements, you only need to transcribe them as classes in your CSS and use those few classes where needed in your HTML.

I'm not a design expert, so take it with a grain of salt, but I used to be terrible and following that workflow allowed me to get decent.

Re: How to build a website without frameworks and tons of libraries

#110

Post by bonzini » Tue, Jul 04, 2023, 9:47 PM UTC

INTPenis wrote: post #12

For information, static sites are unchallenged imho. Even for a certain level of collaboration, I think one could get away with using static sites. I haven't tried this in practice but imagine having a git-based CI/CD flow for a static site, where non-technical end users could use the web-based Markdown editors of github.com or gitlab.com to make small changes, save and push via a pull request. Each merge is of cours…

I am trying it now for some volunteers that I am building a web site for. Building the web site and responsive theme almost from scratch took about 10 hours of work, and further changes will only be the addition of news items ("posts" in Jekyll slang).

The theme is HTML and CSS plus about 20 lines of jQuery JavaScript to handle simple toggle effects such as the hamburger menu on mobile. Probably could be done without jQuery but I am not a web developer and that's what I know. Posts are written in markdown and the idea is that the others will either send me an email or later will open a merge request on GitLab.