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

#241

Post by sanitycheck » Wed, Jul 05, 2023, 9:42 AM UTC

okeuro49 wrote: post #238

sanitycheck wrote: post #235

Earlier quoted context omitted.

Eh, I read this a lot. An app architecture is not a framework, frameworks get complicated because they have to be generalised enough to serve multiple projects with different requirements which leads to a ton of abstraction. Then because they're complicated they're difficult to learn. An architecture concept just needs a page or two of docs and diagrams to understand, and the code is right there in the app. You don't…

> An app architecture i.e. a framework. > Then because they're complicated they're difficult to learn. It's easier to learn a publicly available framework, as there is lots of help on Stackoverflow, and usually the popular frameworks have good, or just existing, documentation. > existing code isn't dependent on some obsolete framework - Ember/Angular 1/etc. The "app architecture" can also become obsolete. But now ins…

No, not a framework. The fundamental idea of a framework is that it's reusable, and there are inherent compromises and complexities which are a direct result of making reusability a goal.

I've adopted lots of code, some good and some terrible. Framework-based code is only easier to understand if I already know the framework and sometimes not even then if the original developers mostly had to fight their framework.

The "app architecture" does not become obsolete because nothing has come along to replace it and it was already simple enough that Stack Overflow was never a necessary part of development.

K.I.S.S. Not just glam metal.

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

#242

Post by wildrhythms » Wed, Jul 05, 2023, 10:35 AM UTC

ad404b8a372f2b9 wrote: post #109

djbusby wrote: post #43

Earlier quoted context omitted.

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…

Without some design knowledge and experience (and dedication), starting from a blank canvas in Figma, Framer, or Penpot is going to be extremely difficult. Design is an art and skill in its own right.

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

#243

Post by account42 » Wed, Jul 05, 2023, 10:47 AM UTC

onion2k wrote: post #62

nickelpro wrote: post #53

Earlier quoted context omitted.

> First, your dark mode is implemented wrong in the lazy corner-cutting way of doing JS post-load ... I agree with your whole comment, but the media query approach is also tricky. You typically still want to offer a toggle while respecting prefers-color-scheme, and you may want to give priority to whatever choice the user has made with that toggle if they've used it on your site before. This still requires JS and loc…

This still requires JS and localstorage. I've been considering this recently for my site and I settled on having prefers-color-scheme on the root domain with dark. and light. subdomains. If the user chooses a color they just get bumped to a subdomain that sets a cookie with their preference. If they come to the site from an external link and they have a preference cookie they get redirected to the subdomain again. Ab…

This sounds like it would have the same problem as redirects to mobile subdomains - users will share links to light. and dark. subdomains, unknowingly forcing their preference onto the recipient.

The proper solution is to only implement the media queries and yell at browser vendors to make this easier to toggle either for all websites or for specific websites. Implementing a light/dark mode switch in every website is absurd.

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

#244

Post by XCSme » Wed, Jul 05, 2023, 10:50 AM UTC

projektfu wrote: post #59

jamiedumont wrote: post #42

I've landed on the same approach for my photography portfolio. Benefit of jumping ship from development to photography is that I don't have to rely on Squarespace like most other photographers! After trying a few server-based options like Ghost, Statamic and self-built ones with Phoenix or Vapor (I've covered some ground as a dev) and the usual SSG options I ended up just writing everything as straight HTML without a…

You could use server-side includes to get the basic prev-next navigation and consistent menus, headers and footers.

PHP!

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

#245

Post by XCSme » Wed, Jul 05, 2023, 10:57 AM UTC

fimdomeio wrote: post #31

I believe the most minimalistic and productive way is to just use php. The language was specifically just created for that. If it's a simple site then you don't need composer you don't need router logic. just create separate files for header footer navigation and include them on each page.

Working with PHP has always been such a breath of fresh air. No build process, just upload the files via FTP and it works. You can keep it as simple as you want (just include() files, write functions directly, I never really need to use classes in PHP).

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

#246

Post by kthartic » Wed, Jul 05, 2023, 10:57 AM UTC

jamiedumont wrote: post #42

I've landed on the same approach for my photography portfolio. Benefit of jumping ship from development to photography is that I don't have to rely on Squarespace like most other photographers! After trying a few server-based options like Ghost, Statamic and self-built ones with Phoenix or Vapor (I've covered some ground as a dev) and the usual SSG options I ended up just writing everything as straight HTML without a…

For my personal photography website I use

  - Svelte + TailwindCSS (Basically just a couple html files, plus the power of templating)
  - Flickr API (To pull my photos from an album that I use just for this website)
  - Netlify (To host the site - all have to do is `git push` and the site auto deploys!)

Total cost (incl hosting): $0

With Flickr I can manage the photos from my phone via the Flickr app.

With Netlify I don't have to tinker with an actual server box, plus it's free.

I love it <3

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

#247

Post by jongjong » Wed, Jul 05, 2023, 10:59 AM UTC

arcanemachiner wrote: post #237

yawnxyz wrote: post #200

Earlier quoted context omitted.

Do you ned a lot of experience to know how to start browser-native tools? I wouldn't have a clue how to start with Web Components and all the other things, to build a I don't think I have the energy to move off from Sveltekit to a new thing, without having to re-learn everything and make a ton of mistakes

It's been a while since I dipped into it, but Web Components use this thing called Shadow DOM to encapsulate the CSS inside from being affected by the stuff outside. Great for compartmentalization, but unnecessary for my personal needs. So if you're curious about the concept, check out Custom Elements. Same thing, but no Shadow DOM. I found them to work quite well for a toy project I made a couple years ago.

Shadow DOM is a nice touch and in terms of isolating CSS definitions per-component, it does something beyond what most popular front frameworks can do. That said, I know some developers don't even use the shadow DOM; you can use inline styles like some people do with React or you can use a centralized stylesheet for skinning and only write barebones CSS definitions as part of components.

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

#248

Post by re-thc » Wed, Jul 05, 2023, 11:01 AM UTC

grogenaut wrote: post #217

SPBS wrote: post #216

Earlier quoted context omitted.

Honestly if the goal is a website as simple as possible, dark mode should not belong there at all. We've had simple readable websites in 90s long before the dark mode fad was a thing, only having light mode is fine. > Third, this binary toggle is a bad way to implement dark mode because it ignores system/browser settings, so if a user has, say, enabled dark-mode on their smartphone OS, they still get served light-mod…

hn isn't pure white and it does kill me at night on powerful monitors... just like I can't do dark mode outside on a laptop. Sure we did readable websites in the 90s, on dialup or slow dsl, and they took forever to load on small monitors. We also didn't have USB or SSDs. Dark mode and light mode is a nice tradeoff for varied lighting conditions.

> and it does kill me at night on powerful monitors

Are they powerful or misconfigured? Something is wrong if the screen hurts your eyes, no matter the colors.

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

#249

Post by skydhash » Wed, Jul 05, 2023, 11:13 AM UTC

udbhavs wrote: post #240

The first hurdle in trying to make simple multipage apps with handwritten HTML/CSS is, as the author mentioned, getting to the step where you have reused components across pages and have to jump into a server-side templating setup like PHP, or use something that introduces a build step if you want to stay static. I don't know why there isn't a simple method for including HTML partials incrementally in handwritten sit…

HTML was built for documents. And documents was supposed to stand on their own, like man pages.

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

#250

Post by matthewhammond » Wed, Jul 05, 2023, 11:17 AM UTC

Uehreka wrote: post #166

I’m just really tired of this debate about “frameworks” and “complexity”. If your client asks you for a custom CMS with a multi-stage publishing workflow with i18n and regulation-compliant a11y, you’ll need high-powered tools to build it in the time clients expect. Lots of clients in enterprise are like this, which is why the demand for this stuff is so high. If you’re working in B2C this may be surprising, but this…

Yes the thing is most people participating in the conversation just haven't worked on the problems these tools are useful for. They maybe are an engineer... but they don't touch frontend, so they don't know much beyond the basics. Or they're a CS student... but they made a personal blog with Jekyll, so of course they know everything about frontend dev. Or they work on internal LoB apps with user counts in the two digits and no UX requirements... but they've been doing it for years, so of course they know all about it. It crowds out the discussion with low information takes.