[a / b / c / d / e / f / g / gif / h / hr / k / m / o / p / s / t / u / v / vg / vm / vmg / vr / vrpg / vst / w / wg] [i / ic] [r9k / s4s / vip] [cm / hm / lgbt / y] [3 / aco / adv / an / bant / biz / cgl / ck / co / diy / fa / fit / gd / hc / his / int / jp / lit / mlp / mu / n / news / out / po / pol / pw / qst / sci / soc / sp / tg / toy / trv / tv / vp / vt / wsg / wsr / x / xs] [Settings] [Search] [Mobile] [Home]
Board
Settings Mobile Home
/g/ - Technology


Thread archived.
You cannot reply anymore.


[Advertise on 4chan]


jQuery won't save us, unless...

>Free beginner resources to get started with HTML, CSS and JS
https://developer.mozilla.org/en-US/docs/Learn - MDN is your best friend for fundamentals
https://web.dev/learn/ - Guides by Google, you can also learn concepts like Accessibility, Responsive Design etc
https://eloquentjavascript.net/Eloquent_JavaScript.pdf - A modern introduction to JavaScript
https://javascript.info/ - Quite a good JS tutorial
https://flukeout.github.io/ - Learn CSS selectors in no time
https://flexboxfroggy.com/ and https://cssgridgarden.com/ - Learn flex and grid in CSS

>Resources for backend languages
https://nodejs.org/en/learn/getting-started/introduction-to-nodejs - An intro to Node.js
https://www.phptutorial.net - A PHP tutorial
https://dev.java/learn/ - A Java tutorial
https://rentry.org/htbby - Links for Python and Go
https://quii.gitbook.io/learn-go-with-tests - Learn Go with Tests

>Resources for miscellaneous areas
https://github.com/bradtraversy/design-resources-for-developers - List of design resources
https://www.digitalocean.com/community/tutorials - Usually the best guides for everything server related

>Need help? Create an example and post the link
https://jsfiddle.net - if you need help with HTML/CSS/JS
https://3v4l.org - if you need help with PHP/HackLang
https://codesandbox.io - if you need help with React/Angular/Vue

/wdg/ may or may not welcome app development discussion. You can post and see what the response is. Some app technologies of course have overlap with web dev, like React Native, Electron, and Flutter.

We have our own website: https://wdg-one.github.io

Submit your project progress updates using this format in your posts, the scraper will pick it up:

:: my-project-title ::
dev:: anon
tools:: PHP, PostgreSQL, etc.
link:: https://my.website.com
repo:: https://github.com/user/repo
progress:: Lorem ipsum dolor sit amet

Previous: https://desuarchive.org/g/thread/109365854
>>
Is VS code the standard for web development? How do you create a project in it then? I want to create a react.js web app.
>>
>>109421022
I'll list them all and u research or ask gpt cus lazy
vim, neovim, emacs
vscode, cursor, vscodium
Visual studio(ide), netbeans, jetbrains and lang specific jetbrains ides
>>
>>109421022
You open an empty folder and start creating your react.js web app
>>
>>109419761
>jQuery won't save us, unless...
Unless nothing. It's obsolete. It has no place in 2026.
>>109421456
I tried vim and neovim but I couldn't get language servers working. I might try again at some point because I like how lighweight vim and neovim are.
>>
>>109423437
unless... we make it what it should be, and what it once was
why not treeshaking done right
why not accurate maths?
why not ts done right?
why not seo done righy?
why not spa + ssr hybrid, done right?
I'm not going to make it, but maybe the real devs and not snake oil salesman should get on it
>>
>>109423437
vi (yep, pre vim) and probs vim as well are kings of collosal file edits and diffs
>>
>>109421022
Install Node.js first, and type in the following in your terminal:

npm create vite@latest


select react-ts and start cooding. VS Code is usually the go-to, unless you want to pay for something like Cursor for AI shizz but I would not if you're still learning, only use it to assist you in actually learning, not coding at this point.
>>
why am I getting critical vulnerabilities when trying to install npm? The npm fix command doesn't do shit.
>>
>>109423925
that's node and npm, they come with vulnerabilities out of the box
>>
File: demo3.gif (273 KB, 1555x817)
273 KB GIF
Looking for feedback on this userscript I'm working on.
I'm trying to streamline the annoying captcha process and I came up with this little helper.

Looking for solid feedback like if it'd be useful and if there's any technical hurdle I might not know about. I haven't worked with the site's captcha before so idk if they change the approach of it regularly or smth.

Let me know if this isnt't the right thread of this.
>>
>>109425037
it's already baller 2bh
ux h4x mode
1. keyboard shortcuts with (f.e.) ctrl + g to L for 1-5 squares ,additionally or also use num keys, just keep in mind that letters are more ergonomic. Then just tab + enter for quick send
opt. 2
hax02 mouse UX
make the send button be close to the squares and follow the cursor along the squares vertical axis for extra quick access
>>
>>109425037
and btw, pls twll us about the user script a bit, like extenssions, functionality and code wise
>>
>>109425090
Thx. For this versuib I kind of made sure it adapted nicely to the 2 types of captchas, the square and rectangular ones. I do need to work on improving the send button UX.

I'm gonna run some test on adding keystroke events. The version from the demo is one I developed that embeds itself on the 4chanx reply widget so I'm expecting some unexpected behavior as I add more logic to it.

>>109425108
Originally I was working on a unified electron app to embed a bunch of QoL features and local archiving tools into but I felt this helper itself could be easily ported to userscripts and adapter to several use cases.
I made one injected into 4chanx for 4chanx users
Another one is just a helper window that pops up independently of what form you're using to reply by catching the captcha events
The last one is a fully integrated reply form I made. I'm not too happy with that one though since it's very hard to beat the amount of feature the 4chanx reply box has. But it may be useful later if I add enough features to it.

Right now I have an MVP version for personal use but my plan is to iterate and test a little more and release it when I'm confident in the UX and the functionality are solid
>>
File: 1775795294315874.mp4 (677 KB, 350x480)
677 KB
677 KB MP4
>>109419761
Why is it so impossible to write maintainable CSS? No matter what strategy I use, it inevitably turns into ignoring old classes and definitions in favor of new ones.

Is there an actual method that prevents this?
>>
>>109426820
If you are lazy, Tailwind, if you aren't, BEM with a proper design system.
>>
>>109426838
What's a proper design system then? I've been using BEM for years now and I still run into these same issues, just later down the road.

Tailwind is nice, but I was hoping to actually solve this the vanilla CSS way.
>>
>>109426862
>What's a proper design system then?
From my experience it means designers creating a solid library of components AND sticking to it, which is the hardest part.
If you achieve that pretty much all the CSS you're going to write is for layout and positioning, which can be done with a self made library, using just a fraction of TW or something like this https://www.pollen.style/.
Personally I don't like using TW for everything. One thing I like about that library is that when you use few (see 5-6 classes tops) on an element, if you're experience with CSS you can get a pretty good idea of how something is going to look without leaving the editor, but using 20+ TW classes feels like an abomination for me and it's even less informative than regular CSS classes.
>>
>>109426919
>From my experience it means designers creating a solid library of components AND sticking to it, which is the hardest part.
It just feels silly that a language like this would require so much deliberation to use well. It's too much of an ask for me personally, I cannot do it, unless you mean really core, reusable stuff in the style of TW classes.

>Personally I don't like using TW for everything.
It took me a while to get used to tailwind, but after a few weeks of using it I am convinced it's definitely the way to go, and I don't even mind having a lot of classes, it's definitely better than the alternative.

Maybe I just need to do it like react and svelte and vue do it, I just need to 1to1 couple my CSS to my components, and never stray away from that. I must say I never really felt the need for TW when I was writing Svelte.
>>
>>109426981
>a language like this would require so much deliberation to use well
It doesn't. The problem is that it requires zero deliberation to use it wrong.
There's a few gotchas but 99% of the time people talk shit about CSS is a skill issue.
>>
>>109427017
Yes, it's a skill issue, like I said. That's the problem.

And you know other people agree with me, because CSS has been consistently growing to introduce more and more scoping mechanisms, including things like layers, @scope (Which I had no fucking idea was a thing), and so on.

This is clearly not as trivial as you make it sound, or we wouldn't have these features in the first place.
>>
>>109425037
Why does the user have to click on next? The script I use for this simply shows you the next challenge when you select one. It's more convenient that way.
>>
>>109428342
To avoid misclicks and sending the wrong response on your fifth round of captcha ruining the entire process. The balanced way to do this would be a double click instead
>>
>>109428667
Nah, a double click would be annoying too. If this is an issue, it'd be more practical to add a previous button and go to the next one by default.
>>
>>109429077
There's no previous button. It works as a pipeline. You only get the next task after you send the previous one to the server.
>>
>>109429161
There really isn't apparently. Oh well. I would still rather use a version that progresses automatically. The captcha humiliation ritual is bad enough as it is.
But then how do extensions that display all challenges on the same screen work?
>>
>>109429195
>But then how do extensions that display all challenges on the same screen work?
Do you have any examples of this? I'd like to check the code.
My guess would be either the server lets you override the response by resending it or I'm actually wrong and you can actually get all the encoded challenges at once.
>>
File: 1767369672322313.jpg (284 KB, 1280x2424)
284 KB JPG
>>109429232
I don't know about userscripts, but otacoo's Clover has this feature
>>
>>109429261
It also has an option to automatically skip to the next challenge when you select an option.
>>
>>109423648
>why not ts done right?
We've got that: https://devblogs.microsoft.com/typescript/announcing-typescript-7-0/

We certainly don't need jQuery
>>
.
>>
>>109425203
effor post x effor post
>>109425203
>keystrokes
take a look at what windows and linux niggas, even mac queers implemented there, aiming specifically at the old school. enjoy

>>109425203
>user scripts
>4chan x
I only trust ublock origin, and I don't even really
I got fitered by violent monkey, but that's territory I'd love to explore for sure, including, for sure firefox extensions
>events
good shit, I need to dive in that
>fully integrated reply form I made. I'm not too happy with
apply KISS principles
>
I'd suggest contributing to 4chan's codebase, not sure how feasible that is, but it'd be ideal
>>
>>109426820
>Why is it so impossible to write maintainable CSS?
rly nigger? I can visualize unmaintainable CSS, but I can also visualize lazily maintaniable css, just think twice, not that hard, refactor later is always an option, that's what clean code preaches, you can spaghett your solution no probs, as long as you make the doublepass and un-retard it
>Is there an actual method that prevents this?
hm... yes it's harder to explain than to apply
guess
1. learn how CSS selector hierarchy works
2. learn when to use IDs vs when to use classes
3. learn when you can use element selectors (and thus not even need classes/IDs or even better combine them gracefully)
4. ?????????
5. profit!

un-taken into account, now you have variables and functions, and it'd be wise to learn when to use them, but to be real, I've never even used or bothered to learn those, not needed, more so when it comes to functions, variables are indeed powerful
>>
>>109426862
I think I pinpoint'd your issue, pen and paper FIRST, no you don't need pen and paper, but it's not "too much" to use it, you have tools like figma or similar, it all boils down to "think first, act second" or how we say roun' here "measure twice, cut once", yes, it so happens that when it comes to building complex structures you might need a time to think and plan first
>>
>>109428342
good pattern 2bh
>>
>>109428667
easily solved by "double click"
but I'd still go for my good 'ol keyboard tab and enter, just supersayan'
>>
>>109431882
Double click is very unnatural in this context even on desktop, and on mobile it's even less acceptable.
>>
>>109432892
>Double click is very unnatural in this context
I don'tsee it that way 2bh
>and on mobile it's even less acceptable.
I can see that yes, could be some kind of tap and hold
>>
>>109434823
>>109432892
maybe even double click isn't that much of a stretch in mobile, assuming you one tap select (with a thick colored border to communicate)and two taps confirm
>>
>>109431842
>>109426820
and btw, as for keyboard, take into account tab + enter navigation

1. text post
tab
2. get captcha button (or skip this if automated)
3. position 1 to last of captcha entities, shift tab goes backwards, tab goes forward
4. tab and enter that just sends
that's how it actually works in 4ch btw
>>
>>109434823
>>109434923
Nah man, on the web and mobile, it's 1 click/tap => 1 action.
Just add an option to automatically go to the next one like Clover.
>>
>>109436064
yeah but nah, you're trying to avoid miss-taps, since it means 60 extra seconds of loading another captcha to start over again
>>
>>109436506
Not gonna click 3 more times for 0 reason. I would just use a better userscript at that point if this one doesn't have that feature.
>>
>>109436840
you just click twice in the same spot, win/win
>>
File: 1765863769508432.png (181 KB, 483x470)
181 KB PNG
should i make a social media platform of some sort as a portfolio showcase project

the issue with this is it probably will never have users and if it did they will probably post cp or some shit
>>
>>
is HTMX good?
>>
>>109444456
htmx is about mvp. if you cant make it work with a single http request you should be worried about your bullshit
>>
>>109438435
well ypu can create a social media app, and just samefag all the interaction. that doesn't mean you can't create the full functionality, open and close public posting and purge undesirable data
best of both worlds
just make sure to samefag at the end when the site is closed else a haxor might wipe ur data or smth
>>
>>109444915
>>109438435
that will give u a chance to talk about to the tech interviewer how you implemented the open close and purge functionalities
>>
>>109438435
i think the only way without money is to just advertise it on your own social media accounts. i host an imageboard but the only time it got like 2 posts was when i shilled it, and it hasnt had any activity since because i havent posted about it again
>>
I don't understand what the instructions for most of the shit on clerk does or mean? Only a few. Wtf am I supposed to do to setup a login and sign up page with clerk??
>>
>>109438435
Don't bother with social media as a portfolio
A big ass amount of work for nothing.
>>
>>109438435
the biggest hurdle for employment is getting past the HR roasties and they don't give a shit about your projects
>>
>>109450174
now a days is the LLM AI CV pre-scanning



[Advertise on 4chan]

Delete Post: [File Only] Style:
[Disable Mobile View / Use Desktop Site]

[Enable Mobile View / Use Mobile Site]

All trademarks and copyrights on this page are owned by their respective parties. Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.