Hacker News new | past | comments | ask | show | jobs | submit login

Since we're on the topic of how people should learn to build web things: what do you think are the most important things to learn first to make web stuff? The "right" way? Just raw HTML, CSS, and some JavaScript (Typescript?)? It seems common among programmers to criticize the overuse of web frameworks. Are there a lot of people who learn only web frameworks?



> what do you think are the most important things to learn first to make web stuff? The "right" way? Just raw HTML, CSS, and some JavaScript (Typescript?)?

Yes. I think all web programmers need to know HTML and CSS. CSS is still just as relevant no matter how you build websites. People should also spend time learning HTML. Like, learn how to make content using raw HTML. Read the HTML of some of your favorite sites. This will improve everything you do with react and friends.

> Are there a lot of people who learn only web frameworks?

Yes.

Web programming probably has more programming beginners than any other area of software development. Its easy to learn - there are no C pointers in sight and no manual memory management. Websites work everywhere. And everyone needs a website - so there's lots of demand for web programmers. The debugging tools are also great (and you already have them if you have chrome installed). And frontend engineering is visual and obvious - so when you mess it up, you can usually tell.

So, yes. There's lots of people who learn just enough to scrape by and start making websites. Its great and terrible. I'm glad web programming is such an on-ramp for beginners. But npm is a disaster, and lots of websites are insecure, slow, amateurish messes.


The right way to start is with HTML and motherfucking website.

https://motherfuckingwebsite.com/

Really. At this point this is what websites should strive to be. Text on the screen.

Everything about HTML can be learned from the MDN documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML

It can be written by hand but that's way too verbose. Pug is a great solution to that problem: it's just HTML but much less verbose. I integrated it with GitHub Pages so pug sources get compiled to HTML and published when commits are pushed. Great experience.

https://pugjs.org/

https://github.com/pugjs/pug

After this, the next step is to learn CSS so you can make it look a little nicer.

https://developer.mozilla.org/en-US/docs/Web/CSS

Javascript should only be necessary if you want to do something like this:

https://ciechanow.ski/mechanical-watch/


Super nitpick, but I much prefer better mother fucking website: http://bettermotherfuckingwebsite.com/

I think at the bare minimum you should strive to be readable, and you can do that with surprisingly few extra lines of CSS and very basic web design principles (avoid using full black or full white backgrounds). CSS is uhh... a choice, but you don't need to know too much in the very beginning to start building up some motivation of making stuff that looks easy on the eyes.


There's also this one with 10 CSS declarations and night mode:

https://perfectmotherfuckingwebsite.com


The so-called "better" motherfucking website is actually worse than the original. Its worst sin being, of course, setting text in illegible gray.

https://contrastrebellion.com/


Illegible? It's #444 on a white background—that is a 9.73:1 contrast ratio, which gives it a perfect AAA accesibility rating.

If you can't read it, there's probably a wild CSS messing things up on your end.


#000 on a white background has an even better contrast ratio.


Yes, and text doesn't need to have maximum contrast (#000 over #FFF) to be legible. The website you linked above says:

> W3C's Web Content Accessibility Guidelines set the minimum contrast between text and its background so that it can be read by people with moderately low vision (which is quite common).

If you follow that link to W3C, you'll see that the minimum contrast for text to be considered legible is 3:1, though that's for people with standard vision (it's the lowest rating). To be truly accessible, the minimum we should strive for is 7:1. Anything above that has a AAA rating.


> Are there a lot of people who learn only web frameworks?

Yes, because many people learn web development through bootcamps or other such courses (modern web dev is not usually taught in college, in my experience) which rush you to "job readiness" thus incentivizing using React over vanilla JS since most web dev jobs use React nowadays.


What would a college that aimed to teach Web Development as a specialty actually look like?

People look down on bootcampers, but it always feels to me that 99% of what is taught in university programs is similarly only useful in specialized situations. The actual good thing is having had to sit down and write a lot of code before anyone lets you touch anything.

What does such a program look like for Web?


Probably something like The Odin Project's JS courses.


I think it's still a good idea to learn by writing HTML pages, then adding a style and script tag in the head. The scripts and styles become enhancements to the page.

If you go to a code bootcamp, you are learning react. A lot of new developers come from these places. Not a bad thing, but they could spend more time on fundamentals


Set the proper goals. The end state is some software product, such as a website. Far too common beginners will attempt to redefine the goal to something more familiar, something like "how to write code". There are people who spend their entire careers mastering exactly how to write the code. This can be described as "expert beginners".

Somebody needs to be the adult in the room and stop the children from running the daycare. As developers we should already know how to write code, or know how to figure it out, and that shouldn't be open to discussion. The discussion must only be upon defining the goals and stepping backwards one step at a time. This is called planning and proper planning will ensure the necessary automated checks are in place. Then "how to write the code" becomes straight forward as it either conforms to the automated checks or becomes a matter for discussion.


I don't think vanilla HTML/CSS/JS is the way to go for beginners because of the "time to visually interesting results" problem. Starting with a framework that has widgets you can reuse is much more interesting and motivating.

That said, I'd argue that the selected framework should be one that doesn't completely obscure all the underlying HTML/CSS/JS (I'd avoid TypeScript at first) from them so it's easy to learn that when needed, plus it makes debugging using browser dev tools easier and means they'll have transferable skills for learning a second framework.

GWT (RIP, thank goodness) would be the extreme negative example, but React is on that side of the spectrum as well.

Vue, Svelte, Lit, and Angular seem to be the most popular frameworks on the "closer to HTML/CSS/JS" side of the spectrum, though I only have experience with the last two. Lit's great; Angular's not my favorite.


> I don't think vanilla HTML/CSS/JS is the way to go for beginners because of the "time to visually interesting results" problem.

I don't think it's worth beginners learning the road rules and safety protocols, because of the "time to being responsible for a heavy, fast motor-vehicle sharing a road with other people" problem.


In the 90s complete amateurs were able to make "visually interesting results" with little more than Notepad and a copy of "HTML for Dummies".


I'm surprised to not see NEXT.js mentioned. For anyone comfortable in the React world it pushes a much more classic <a> tag link model throughout the app while still allowing reactive and responsive behaviours.


I'm not professional web developer, but I started raw, then expanded with JQuery, then much later tried some frameworks. I think it's important the understand the underlying core HTML/CSS/JS since EVERYTHING ELSE is ultimately abstracting and/or transpiling down to those raw ingredients. But I'm more of a bottom up type of person, so YMMV.

Now, for proper web principles and design methodologies, I'd love for some tips there.


The coolest framework of them all, vanilaJS.




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: