11 ms·
A Short Guide to Minimal Web Development (2018)
- untog 6y agoI'm sorry, but any guide that suggests you start by reading the entire specs for HTML, CSS and JS is just not realistic. The guide gets it right in the "practise" part, though: the beauty of the web is that you can write an HTML file and immediately see what you created in the browser. You don't need to read the HTML spec's instructions on Microdata before you do that.
- jiofih 6y agoThis is not a beginner’s guide, and the author acknowledged he himself has not read the full spec - it’s merely encouraged as a reference to go back to.
- detaro 6y agoI feel like for mastery the recommendation to read specs is a valid one. Not necessarily in their entirety, but they're worth exploring. And the HTML/CSS standards also often are useful as references.
- theandrewbailey 6y agoAgreed. In my experience, I've learned more from reading MDN than specs.
- jrochkind1 6y agoFew people have probably read those specs cover-to-cover with full attention. But never opening them is a mistake. The value of taking a look, skimming around, reading a few parts that seem interesting to you, is HUGE compared to never even having looked in there. And then continuing to do so when a curiosity arises.
- rimliu 6y agoIt is very realistic. The first thing I did when I got interested in HTML was to print out the spec. I do not get this attitude that blindly poking around for hours in hope to stumble upon something that works is superior to reading the docs.
- superfamicom 6y agoI would recommend linters (ESLint) to beginners as I use it as a long time not-beginner to point out silly mistakes, which can be the hardest and most frustrating to spot. > [T]hey’re as useful to learn coding as it is to use ready-to-heat-up dough and buns to become a baker. I would imagine getting a familiarity with a new oven would be a good use for a new baker experimenting with ready to bake items. I get the feeling the author is into a very brutal style of learning that might resonate with some, but probably not most with their steps. This is from 2018 and updated last in 2019, but the title didn't show that.
- gosukiwi 6y agoI was gonna point out the same. Linters are great, for newbies and professionals alike. If you don't like a rule you can change it. I'd say: As a newby, just don't change any rule and use standard settings.
- deleted 6y ago[deleted]
- prashnts 6y agoI constantly need to add a couple of exceptions to the defaults though. And only because it's pretty weird syntax to let you get the block level meaning become obvious for a small part of the otherwise current standards we are using. (Whenever the indentation fights settle down...) Couple of constants look good together if you look at their semantics, but the rest turns into a mess!
- xmprt 6y agoI remember adding a linter to a relatively large project that I was working on after a few months and then realizing how many errors there were that I was surprised the project even worked in some cases (it probably didn't but I never bothered testing those edge cases).
- jrumbut 6y agoPlenty of projects that are actually fine blow up linters. If you to want to add a linter you can either add one rule at a time or make it part of your process that the number of warnings goes down with every merge.
- draw_down 6y agoWe also need guides on what to do when you inherit an artisanal curated minimalist frontend coded up by some genius who is no longer around. You'll surely be jumping for joy when you discover it doesn't use frameworks! So simple and clean!
- redmagic 6y agoThis webpage which is a guide to hand coding things appears to not have a closing </head>, </body>, or </html> tag.
- redmagic 6y agoThat being said, I very much like the spirit of the document. Many many good points.
- detaro 6y agoThat is completely valid HTML5. https://html5.validator.nu/?doc=https%3A%2F%2Fmeiert.com%2Fen%2Fblog%2Fminimal-web-development%2F https://html5.validator.nu/?doc=https%3A%2F%2Fmeiert.com%2Fe...
- cringepirate 6y agoThat maybe but it differs from what is shown in the inspector (which shows the <head> and <body> tags). This could be confusing as the source html doesn't match how the browser interprets it.
- giantrobot 6y agoWeb inspectors are showing a representation of the DOM, they are not showing the raw source. Netscape and IE used to have "Show Source" functions that literally showed just the page source. Inspectors will do things like display colors as their RGB triples i.e. rgb(x, y, z) in computed styles when a color has been defined in the HTML like in a body tag or table cell's bgcolor attribute.
- recursive 6y agoAll browsers still have show source. It's just not usually that useful anymore.
- cringepirate 6y agoYes I am aware. It can be confusing if you are new. I had someone ask me why it was different the other day.
- umvi 6y agoI recently started a new project using only pixi + vanilla js. No frameworks. No npm. Just pixi.min.js + vanilla js included into an html file. It's super refreshing - the js files are tiny, the load times are insane (instant), other people can read my code without having to learn a new framework. I am thinking about using npm to get access to linting, uglify, etc. but that would be strictly for distribution, not development.
- kaycebasques 6y agoNever heard of Pixi. What are you using it for? https://www.pixijs.com/ https://www.pixijs.com/
- umvi 6y agoA video game. A week ago there was a HN post on ct.js[0], and that's when I discovered pixi.js. I suppose I could have also used phaser.js, but pixi is more minimal and I liked the idea of developing a custom engine for my game idea (apart from the rendering bits). [0] https://news.ycombinator.com/item?id=24176655 https://news.ycombinator.com/item?id=24176655
- khalilravanna 6y agoI worked on a game for a couple of years and did the same thing. Phaser was too clunky for my purposes and didn't seem to scale for the size of game I was working on. I learned a ton by having to write a ton of the rendering/camera logic that Phaser gives you for free. Highly recommend it for learning purposes alone!
- zelphirkalt 6y agoOther people can read your code, only as long as you do not uglify it. If you uglify it and ship source maps, that might be OK, but seriously it's not worth it for a minimalistic approach. It will only waste your time.
- x87678r 6y agoAs an experienced back end developer that has done a bit of ASP/JSP/PHP in the past but really tried to avoid JS. What is the best place to start now? I figure react is #1 but vue looks simpler. Any moocs or books worth reading first? Or dive in and build something?
- ErikAugust 6y agoWell, you could... take a look at article that you are commenting about.
- aryonoco 6y agoEloquent JavaScript and the You Don't Know JavaScript series are my favourite books. Both available for free online. Depends on what you want to do. For work, yes React is king and has an absolutely huge ecosystem built around it. For fun? I'd look into Svelte, fixes a lot of the pain points of React and Vue. Also the Javascript DOM API has come a long way itself and IMO, while a library/framework is helpful if you're building a complex web app with lots of states, the great majority of websites out there don't need a framework and can be built statically with something like Eleventy.
- k1m 6y agoI'm more a back end developer myself, but have really enjoyed Vue. My recommendation would be to try a few basic intros to Vue, but try to avoid the ones that want to get you set up with a whole bunch of command-line tools to compile/pack/whatnot the project. (Those can feel quite daunting to start with, and are actually not necessary if the size of your project doesn't require it.) Just include Vue from CDN as a script tag. And if you want a jump-start with ready-made components and good styling, I can also recommend Buefy - https://buefy.org/documentation https://buefy.org/documentation - like Vue, it can also be included with a simple script tag, without any command line tools.
- type0 6y agoI like Bulma and Vue, thanks for mentioning Buefy, had no idea it existed.
- fcatus 6y agoShould be: "A short Guide to Hippie Web Development"
- fdjlasdfjl 6y agoA Short Guide to How I Built Web Pages in 1999
- OutsmartDan 6y agoI would argue that reset style sheets or normalizers should be part of your "minimal web dev" process, even if you roll your own version. There are so many browser nuances that these things fix so that you don't have to hack it later down the line.
- replies-to-fool 6y agoI think the idea is for you to build your own reset as the need for each individual feature comes up, instead of just throwing in a style sheet and not bothering to understand it. For example, setting the box sizing properly in order to ensure consistent widths regardless of borders or padding.
- prashnts 6y agoAlso add polyfills. Few devices (usually the slightly older fw locked devices) which can get a reuse on local net will get some reuse benefit if you added polyfills. I am doing this by conditional "polyfills with SSR" with nginx/lua at the moment. (kindle os/etc. is a pretty good catchall proxy for those browsers; since they still show some html, you can get a very reliable static+interactive (page refresh syncs nicely with the latency) use out of them. (actually, just to periodically update the view of some react page, running headless...) Edit: Well, that's an extreme, but it has happened that latest react code won't work on a newly unwrapped device still awaiting next fw update).
- nhooyr 6y agothat used to be true but in 2020 the differences aren’t significant when it comes to css anymore.
- rimliu 6y agoWe need less cargo-culting, not more of it.
- bob29 6y ago"Minimal Web development" now theres an oxymoron, "Efficient Waste of TIme. Look into Gemini its much better.
- deleted 6y ago[deleted]
- type0 6y agoStrange no one has yet mentioned Resilient Web Design Book https://resilientwebdesign.com/ https://resilientwebdesign.com/ Besides those principles I find Pug to be indispensable for writing "pythonic" style HTML https://pugjs.org https://pugjs.org You can rearrange the structure easily by "moving" lines of code up or down in your editor, you can set it to auto-compile on saving, just awesome.
- rK5Q58 6y agoStopped reading at "Did you know? Not blocking ads helps content creators[...]" How are you gonna advocate for a minimal web when you're so oblivious to adtech current year?
- bitxbit 6y agoAs someone who developed web applications appx 20 years ago and back doing it for a few personal projects in the past couple of years, I am a bit disappointed in the progress that’s been made in the web development space. Edit: specifically front end.
- blaufast 6y agoThis article is pure poison. Ideological purity is a problem in every facet of human life, and engineering doesn’t have to be so painful. The computer should work for the human.
- gcpwnd 6y agoJust two more generations and writing vanilla js/css is an elitist skill for ancient blue whales.
- _def 6y agoA terminal client is recommended... Yeah let me just pitch that to my client-- nope, that gig is gone now.
- PretzelFisch 6y agosmall gripe, vanilla is a flavor. Please use plain javascript.
- ponderingfish 6y agoWhat is someone is trying to build a blog? I think the most minimal web development for building a blog comes from Static Site Generators that the author is suggesting to avoid. You can't get more minimal than Hugo, Jekyll when trying to build a blog. My blog is fully functional and apart from Google Analytics, it doesn't use any JS at all.
- cxr 6y ago> You can't get more minimal than Hugo, Jekyll when trying to build a blog. Untrue. > My blog [...] doesn't use any JS at all. Now suppose there were JS used on some page(s), and that is the static site generator...
- ellinoora 6y agoI think this is a great counter-argument to the current state of the frontend development ecosystem, which is far from minimal. The article might be too extreme, but I would love to see more minimalism on the general approach to things.
- z3t4 6y agoStatic site generators are great if you do plain/vanilla static HTML sites. Server-side-include only gets you so far, a static site generator give you much more freedom and it can do a lot more work for you.
- petecorreia 6y agoThis isn't minimal, it's primitive. Knowing the difference is key.