Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Web Development for Beginners – A Curriculum

github.com

Post reply on HN
Print view View original

101–110 of 111 posts

Re: Web Development for Beginners – A Curriculum

#101

Post by chrisweekly »

mrslave wrote: post #90
atoav wrote: post #74

Earlier quoted context omitted.

I teach that kind of stuff at university — I would never think about teaching JS before HTML and CSS. Students should understand what ia possible with HTML and CSS alone. Then we look at the server side, and understand infrastructure and how servers can potentially deliver different HTML and CSS depending on the request and then we start introducing JS as a means to replace serverside stuff, to enrich HTNL and CSS or…

I am trying to finally learn what's going on in the web browser and my biggest hurdle has been CSS. I can read & write rules but the questions are really, which rules and under what circumstances? That plus the different layouts (grid, FlexBox, etc. -- terminology almost certainly wrong, sorry!). Can you please recommend a good resource for learning CSS & layouts?

https://every-layout.dev is amazing, and teaches foundations and builds up from first principles.

Re: Web Development for Beginners – A Curriculum

#102

Post by e12e »

legopeice wrote: post #98
e12e wrote: post #94

Earlier quoted context omitted.

You need to share state. You might only store finished loan applications server side, but often it's nice to allow a user to pick up where they left off. Or keep a list of started, not finished applications, to hand over to sales. Etc. But sure, application state might not go in the same db/schema as completed transactions.

Seems like a pretty good place for the browser and JS to step in? unless you want a DB full of application_partial tables?

Well, if you want to allow users to resume sessions from desktop on laptop/phone/tablet - you need to store state somewhere else.

But there are different levels of state: completed transactions (application finished and submitted), partial business logic transactions (three out of five steps completed) and "app state" (field 6 of form 4 partially filled in etc).

They can all be kept diffently in sync (in sync, because the browser will keep partial state via native widgets if nothing else). Even w3m keeps track of inputs in forms before submission.

Re: Web Development for Beginners – A Curriculum

#103

Post by chrisweekly »

bhobs wrote: post #66
userbinator wrote: post #44

about JavaScript, CSS, and HTML basics ...and this is where it goes off the rails; teaching JS before HTML is how we will continue to have the ridiculous proliferation of app-sites that shouldn't require a single line of JS instead needing the latest version of $browser (you have a choice of browser - pick one ...) to even show any content at all. Forms don't need any JS to work, yet the impression this gives to begi…

This view that you don’t need JS and can do most things natively is tired and screams of old timers trying to cling on to the past, when web pages didn’t have rich user interactions and good UX. Sure, you can build forms that perform full page refreshes, but ajax requests offer a better user experience.

See https://remix.run for a clear demonstration of "best of both worlds".

Re: Web Development for Beginners – A Curriculum

#104

Post by kevinfiol »

nlnn wrote: post #47

I'm an experienced backend developer but always struggled with learning modern web development. I understand all the core well (html, CSS, JavaScript, etc.), but struggle with choosing the right high level abstraction/framework/technology for ideas I want to implement. E.g. should I make it a single page app or not? Should I be using ES6 imports? Which build tool? Would I want React or Vue or something simpler here?…

Use esbuild and plain CSS to start. Consider Mithril.js for something React-like, or something like Alpine.js.

Re: Web Development for Beginners – A Curriculum

#105

Post by nlnn »

Heyso wrote: post #59
nlnn wrote: post #47

I'm an experienced backend developer but always struggled with learning modern web development. I understand all the core well (html, CSS, JavaScript, etc.), but struggle with choosing the right high level abstraction/framework/technology for ideas I want to implement. E.g. should I make it a single page app or not? Should I be using ES6 imports? Which build tool? Would I want React or Vue or something simpler here?…

Fullstack dev here with more experience in front-end. I struggle too. I'll tried a lot of different things (ex : puppeteer vs cypress, react vs angular2), and I end up having my own preference. I'll try to answer some of your questions : - Should I use SPA ? Slower initial page loading time, but faster to load more pages. Good if typical user stay long on website and navigate multiple pages. - Es6 import ? Use them w…

Thanks, that's super helpful. Would have loved to have found something like this as a high level flowchart or similar somewhere.

Sometimes a lot of the tradeoffs or design choices behind a tech aren't obvious from the outset.

Re: Web Development for Beginners – A Curriculum

#106

Post by nlnn »

legopeice wrote: post #82
nlnn wrote: post #47

I'm an experienced backend developer but always struggled with learning modern web development. I understand all the core well (html, CSS, JavaScript, etc.), but struggle with choosing the right high level abstraction/framework/technology for ideas I want to implement. E.g. should I make it a single page app or not? Should I be using ES6 imports? Which build tool? Would I want React or Vue or something simpler here?…

I think sveltekit gets it right most of the time. yes its new tech. but I think its way better than the alternatives already. You want a frontend server that handles auth and credentials. cleans up queries to and from the main backend server. Then you want as low-level interaction as possible in the HTML space. HTML doesnt provide everything you need. but it gets close. JS should augment HTML, the closer you stay to…

I've been looking into that too, it makes a lot of sense to me (and appeals in a lot of ways).

The newness is the only thing that's put me off, mostly due to lack of finding good examples compared to Vue/React for various things.

But I figure that if I start with either of Vue/React, I should be able to then translate anything useful I find there to Svelte eventually.

Re: Web Development for Beginners – A Curriculum

#107

Post by xigoi »

DeathArrow wrote: post #62
KronisLV wrote: post #53

Earlier quoted context omitted.

> The agenda is obvious to anyone who cares to look. Alternatively: it's just teaching whatever is popular in the industry, for better or worse (similarly to how DevOps people would be taught Kubernetes, even if it can be horrible in certain cases and for smaller projects). Many sites out there don't need JS. Server side rendering would suffice. And many other sites out there would be well served with minimal JS for…

>Many sites out there don't need JS. Server side rendering would suffice. But many push towards single page apps even if a web site is better suited for the job. If you only have a hammer in your toolbox... Also, you can have SPAs without Javascript, you can use any language / framework that targets Web Assembly. I enjoy Blazor for SPA.

How do you use WebAssembly without JavaScript? I thought it still requires glue code in order to access the DOM.

Re: Web Development for Beginners – A Curriculum

#108

Post by legopeice »

e12e wrote: post #102
legopeice wrote: post #98

Earlier quoted context omitted.

Seems like a pretty good place for the browser and JS to step in? unless you want a DB full of application_partial tables?

Well, if you want to allow users to resume sessions from desktop on laptop/phone/tablet - you need to store state somewhere else. But there are different levels of state: completed transactions (application finished and submitted), partial business logic transactions (three out of five steps completed) and "app state" (field 6 of form 4 partially filled in etc). They can all be kept diffently in sync (in sync, becaus…

Seems we are having a different discussion now about shared state instead of whether JS is necessary and capable. Over used. definitely. Obsolete and to be derided at every turn. absolutely not.

Re: Web Development for Beginners – A Curriculum

#109

Post by KronisLV »

solarengineer wrote: post #76
serial_dev wrote: post #63

Earlier quoted context omitted.

While I agree with you that knowing the basics is obviously helpful and desired, in the end what gets you your first job isn't "what happens when I type a URL into the browser". What gets you your first job is you knowing how to use the tools that the companies already use to ship software solutions on the web. If they use react, webpack, graphql, then your best bet at getting your first job is learning enough about…

I have worked with people who are "fullstack" with Javascript + Typescript, but do not even know what a CPU core is. Some are even amazed that a basic HTML page can be created with a plain text editor. Such people are "ReactJS" specialists, not even Javascript/Typescript specialists. One cannot easily engage in a conversation on types with them - not that they are negative or close-minded, but such concepts are in th…

> I have worked with people who are "fullstack" with Javascript + Typescript, but do not even know what a CPU core is.

Now, this is the opposite of the point that you're making, but i have to admit that it's pretty cool on some morbid level! The fact that we have abstractions that are strong enough for them not to leak and make people dig into the details (e.g. the JS event loop being all that they need to think about).

That's also why tens of millions of people out there can work with spreadsheets of text processing software without knowing what a compiler or interpreter is, or even caring much about the benefits of dynamic linking vs static linking.

Similarly, i can write SQL against a DB without knowing anything about the RUM conjecture or really much about anything apart from the very basics of ACID (at least before Oracle fails to plan queries correctly and needs either statistics to be regenerated or hints added for the optimizer, because it's an evil piece of software).

It just works. I'd argue that it's the way things should be - working on the JVM should absolve one from thinking about compile targets and worrying about things like whether the CPU is from Intel or AMD, or what the ASM format is or whatever. Working in the browser might as well absolve one from worrying about most platform minutea as well, otherwise nothing would get done.

Is is still nice to have a bit of curiosity and explore those things, there being some merit to that, which might as well not be immediately apparent? Sure! Is it required for those people to truly be specialists in their own niche and to be safe from people making fun of their other shortcomings online? Absolutely not!

Re: Web Development for Beginners – A Curriculum

#110

Post by e12e »

legopeice wrote: post #108
e12e wrote: post #102

Earlier quoted context omitted.

Well, if you want to allow users to resume sessions from desktop on laptop/phone/tablet - you need to store state somewhere else. But there are different levels of state: completed transactions (application finished and submitted), partial business logic transactions (three out of five steps completed) and "app state" (field 6 of form 4 partially filled in etc). They can all be kept diffently in sync (in sync, becaus…

Seems we are having a different discussion now about shared state instead of whether JS is necessary and capable. Over used. definitely. Obsolete and to be derided at every turn. absolutely not.

The initial question (how would you create a form for handling creating multiple dependent resources without using js) - is inherently about various types of state - and if/how to share them between the client and the server.

As I mentioned, I think complex business flows like these can be a great reason to go from "web page" to "web app" - precisely because it enables rich, ephemeral client state with (some) business rules close to the client.

But that doesn't mean you can't do powerful things with just html/http and some form of continuations etc on the back-end.

Post reply on HN