[a / b / c / d / e / f / g / gif / h / hr / k / m / o / p / r / s / t / u / v / vg / vm / vmg / vr / vrpg / vst / w / wg] [i / ic] [r9k / s4s / vip / qa] [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

Name
Options
Comment
Verification
4chan Pass users can bypass this verification. [Learn More] [Login]
File
  • Please read the Rules and FAQ before posting.
  • You may highlight syntax and preserve whitespace by using [code] tags.

08/21/20New boards added: /vrpg/, /vmg/, /vst/ and /vm/
05/04/17New trial board added: /bant/ - International/Random
10/04/16New board for 4chan Pass users: /vip/ - Very Important Posts
[Hide] [Show All]


[Advertise on 4chan]


*** Please be civil, notice the "Friendly" in the thread subject ***

>Free beginner resources to get started with HTML, CSS and JS
https://developer.mozilla.org/en-US/docs/Learn - MDN is your friend for web dev fundamentals (go to the "See also" section for other Mozilla approved tutorials, like The Odin Project)
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://flexboxfroggy.com/ and https://cssgridgarden.com/ - Learn flex and grid in CSS

>Resources for backend languages
https://www.phptutorial.net - A PHP tutorial
https://dev.java/learn/ - A Java tutorial
https://rentry.org/htbby - Links for Python and Go

>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

>Staying up to date
https://cooperpress.com/publications/ - Several weekly newsletters for different subjects you can subscribe to

>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 in this thread. 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, MySQL, etc.
link:: https://my.website.com
repo:: https://github.com/user/repo
progress:: Lorem ipsum dolor sit amet


Previous: >>103203186
>>
>>103266938
First for beheading niggers with chainsaws and JavaScript
>>
File: file.png (62 KB, 301x168)
62 KB
62 KB PNG
>>103266938
This graph is very nice, very nice. Now show me the graph with jQuery on it.
>>
>>103267997
jQuery is in the dustbin of history where it belongs
>>
Any experience moving to a mobile app?

We've got early signs of PMF with a PWA I've built on Laravel + Inertia + React. The promise of Inertia being you don't have to decouple your frontend and do state management there, you can just build it in the old school monolithic way.

So it's helped me build fast, but users keep asking for a mobile app. I figure this requires a complete ground up rebuild, but with everything being so server driven I'm not even sure what the approach should be. Do we have to introduce some sort of local storage mechanism whereby they have their entire account state synced locally to their device, and we maintain a copy of that on the server they can refresh when online?

Then do we maintain both codebases, or force everyone onto the new mobile app? How do we even manage it as a business - there's huge opportunity cost in stopping feature development to rebuild, and having to deal with the walled gardens, just to get their distribution.

Because we're burning our runway, I think this shit could kill us if we get it wrong. But the later we leave it the more work we have to re-do if we do eventually decide we have to go native.
>>
>>103268032
pleb take, jQuery could be the future, again
>>
>>103266938
I hate react. I had to use that trash for like 6 months until we hired some senior FE developers and they took over our react apps and now I never have to touch it again
>>
>>103267997
>>
>>103268719
daaaamn son
>>
>>103268719
It is actually unreal that Nuxt is lower and is almost half of the market share of AngularJS, the deprecated version.
>>
>>103268108
I don't see what purpose jQuery serves anymore

>>103268586
I like it, it's easy to use. I do think React sites can become bloated but that's the users' problem, not my problem.

>>103268719
>jQuery
>Angular
>ASP.NET CORE
The trifecta of disgusting technologies
>>
>>
is there any real reason not to use react and nextjs static site generation for a static site? i see people seething about it being the wrong tool for the job and you should just use something made for that purpose like gatsby but I already know react
>>
File: wordmark_light.png (82 KB, 1875x564)
82 KB
82 KB PNG
*makes your framework hopping obsolete*
>>
>>103266938
thoughts on elixir bros?
I think it looks pretty comfy. might get into it for backend
>>
>>103269344
>I don't see what purpose jQuery serves anymore
it serves none, but we can make it
>>
I just use HTML, CSS, and vanilla JavaScript.
>>
>>103272066
Chaotic neutral
>>
good morning sirs. I have 50 years of javascript experience
>>
>>103272078
my favorite
>>
>>103272078
I’ve tried a few times to learn react but I always get about 10 minutes into a tutorial and just quite. I have no need for it. Right now for work we use a Microsoft stack, .net back end with c#. Ive started moving more and more towards a .net 8 odata API to get data on the front end using js fetch calls.
>>
is a modern website that does fetch minimal data from the DB, with not so many products even, , that manages to fetch the data in < 0.5 seconds possible? top fucking keke
>>
File: fat fuck pepe.png (55 KB, 320x320)
55 KB
55 KB PNG
I just bought a VPS and a domain name and I'm going to be making a bunch of containerized local web applications that I'll be able to access from anywhere. Is there anything specifically I should be focusing on that would be good to show off on a resume or in interviews later? I have the free year of AWS hosting too and plan to make a bunch of dummy projects utilizing lambda/s3/whatever as well.
>>
>>103273483
sorting algorithm visualizer
>woah this dude knows progreming
site with real payments
something cool with AI
>>
>>103268063
users are the fucking worst.
Anyway I don't know the project but don't rebuild the app, build another app for mobile while keeping the app alive.
As how you manage the whole thing, it depends but if everything is done on the server, just do everything on the server and instead of using inertia you make new APIs for mobile that live along inertia. Then you make an app using react native or ionic to connect to those APIs.
Yes, you end up with multiple codebase but that's what happens in many organizations and they survive no problem.
Eventually if you see mobile brings you more revenue you slowly discontinue the inertia stuff and use the react native or ionic app in the browser too.

Good luck.
>>
>>103271726
after moving to react i cant imagine not being able to use react-aria/radix components and form hooks anymore
>>
>>103268063
I'm very interested in this because I'm getting very, very close to finishing my app and fully launching it. I always assumed a PWA would be a fine substitute for an app in the eyes of a user. What's the reasoning for wanting an app app vs the PWA?
>>
>>103266938
Are there any benefits to using laravel with WordPress?
>>
I've been fighting with css 3d perspectives for hours, only to finally discover that css filters breaks it.
>>
I've decided to learn PHP and Laravel for the sake of free lancing due to a massive support of free lance jobs among the Laravel community. Also the free lance course suggested skill doesn't mention node.js but mentions tons of pho stuff and WordPress and Laravel.

I'll only use node.js for personal projects from now on.
>>
>>103266938
those numbers don't add up to 100, retard. did nvidia make that chart?
>>
>>103266938
Hey guys, I'm a firmware dev, I mostly program in C but every so often I need to make a simple webui with flask to display graphs and other data from sqlite database or something
What can I use to make my dashboards look good and slick? I only know how to use bootstrap (barely). I can program in javascript but I don't know any external libraries that you guy use

I just want something that I can always go to, whenever I need a good looking dashboard. I also know pyqt5 but its tiresome to use and can't be used in browsers (can't be accessed from other machines)
>>
>>103271726
ssg is basically the one thing next is genuinely good at. even then, you're probably still better off using astro if all you need is ssg + little bits of react interactivity here and there

>>103271761
>mfw considering hopping from nextjs to tanstack start
>>
>>103273833
Yeah I guess you're right, strangler approach and all that. The reason it's becoming a pressing issue is that we're attempting to close a round and we're thinking about the financial model and the potential hires. So we probably want to hire some mobile devs, but that's betting the farm on a certain stack I'm not personally familiar with.
It sounds like the big choice we'd have to make is Ionic vs RN+Expo, with the latter being the more native-like better experience end result? But I really don't know yet, need to do my research.
>>103275585
Users still aren't aware of what a PWA is, it confuses them and they just ask "when will there be an app?". I've put a lot of design time and thought into our Install screen, timing it at the point of maximum motivation, making it clear and detecting the device to provide clearer instructions, and we still lose plenty of people. We know "Installing"/Add to Home Screen is really important because we basically lose all users who don't do it.
>>
>>103278203
I guess HTMX appeals to people who don't know JavaScript and don't want to learn it

But I've done JS/TS for a while now so I have no reason to look at HTMX really
>>
>>103276701
Why do you think I made the graph myself you genuine moron?

And they don't need to add up to 100 but you're so fucking stupid that you can't understand why that is

You are too stupid to fit into this thread
>>
>>103278845
Try alpine or setting nigger babies on fire then.
>>
>>103276840
react/svelte/angular/etc., the tooling might look intense and too much for a small project, but you really only need to run node when developing, and then you just build and copy the files over so you can connect and load the index.html where everything is mounted automatically

for the longest time i avoided frameworks in my laravel projects because i thought itd just add more complexity, but it really makes building frontends easier than writing jquery for every single thing. nevermind that the end result looks way more organized and prettier than bootstrap too depending on the component libraries you use, like shadcn, MUI...
>>
>>103279139
I use alpine.js with node.js right now. But I'm I bought a course from Brad Traversy on Laravel just yesterday and he recommends Alpine.js for it which is surprising since he's like the biggest webdev YouTuber and has tried so many different technologies.

You should give alpine a try. It's like the new jQuery. Makes things ez. You do your code from the HTML, it's familiar to how angular's templating looks.
>>
>>103279380
>buying a course
>>
>>103279139
nta, but yes, my "best" experience was using angular, the directory system it enforces on you is quiet combenient, vue was more anything goes, but idk, maybe we could just emulate just that, structure with just vanilla, perhaps some npm ts support would be enough, or would you need something else just for minimal setup?
>>
is anyone familiar with django rest framework? i dont know anything about web development but my job forces me to deal with this shit to do minor things every now and then (never enough time to learn anything, just gun-to-the-head get it done and onto the next BS)

I wrote a DRF view that forwards a request to another service. It works fine when I test with a simple curl command, where I specify basic auth. However when someone uses a web browser and it has session cookies and all that, DRF blows up and says
"unsupported media type". The content type header in all cases is the same, so I dont knwo why i get that

I want to understand what is going on, is there any way to enable some magic debugging setting that will give me a trace of what is actually getting executed when that request is handled?
>>
I will answer your AWS or SQL questions until it is time to go over my dad's house to watch the game
>I've been reading and reading and I want to read more to learn, what should I read?
don't. build.
>sell me on using AWS instead of a VPS
I'm not a salesman and you haven't given me a use case.
>>
>nextjs 15.0.4-canary.24
>react 19.0.0-rc.1
>babel-plugin-react-compiler 19.0.0-beta-0dec889-20241115
>tailwind 4.0.0-beta.2

yep that's the stuff
>>
>>103280038
>tailwind
faggot
>>
>>103280038
can anyone give insight on react + next + let's say some othe back end like .NET or PHP?
>>
>>103278152
>Users still aren't aware of what a PWA is
Yeah I've anticipated this, but assumed having a nice big dumb "download app" button in the appropriate place would handle that, but seems that's a bad assumption.

If you go the route of the other anon's recommendation I know that in Rails a controller action can handle multiple different response types, so you can just render a page if it's an html req, turbo for turbo, json for APIs, XML for your grandma's 2002 Compac Pisario 5000 using IE 2, etc - and I'm pretty sure Laravel has something similar. That way you're not redoing the entire back end, you don't have to scrape your current app, and by just adding in an "if expects JSON => send JSON" snippet into your controllers (or whatever Laravel calls handlers) you've transformed your backend into an API for the new frontend/mobile apps.

Also, just to keep it even simpler: have you looked at putting the PWA onto the app stores? Do they even allow that?
>>
>>103279456
It's like 9 dollars you nigger
>>
>>103280038
>tailwind
retard alert
>>
>>103280090
>>103280400
but why?
>inb4 iT's AcTuAlLy InLiNe Styles
I mean real critizism
>>
time to answer the discipline call
>>
>>103280038
Tailwind a shit

>>103280463
>Let's have 30 pseudo elements calling from a JavaScript library to style a button for every button instead of just writing a CSS class because tech retards think overcomplicating shit means it's good

You're such a stupid fucking nigger I hope you get bone cancer and die retard
>>
>>103280748
>I like to spend 10000000000000000000 years styling my buttons bro
>>
>>103280748
>>103280400
>>103280090
is this actually justified autism or did some youtuber make a diss video on tailwind recently
>>
>>103280845
>>103280748
>make a button component will all my classes for styling
>reuse it on every form
>problem solved
nevermind after just a second of critical thinking ive come to the realization this is bait and that i fell for it
>>
>>103280845
some posters on /wdg/ are turo butthurt at it for some reason
>>
>>103280875
yes, but tailwind is precisely for NOT making ure own and using prebuilt ones with option for customizing, literally 2 different use cases
>>
>>103280845
ttd
total tailwind death
>>
>mention tailwind once
>>muh vanilla css
>>muh bloat
>>muh html shidded up
based tailwind
>>
>>103281333
yes, like bootstrap but better, no need to cry about it imo, also
>
>>
>>103280845
Can't you use inheritance with it anyway?
>>
File: applepe.jpg (93 KB, 654x1000)
93 KB
93 KB JPG
redux is just a backend api style system to manage app state
path is renamed to type and body to payload
>>
>>103268719
fuuuuuuuuuuck Elm. straight up. guy tried to get us to switch over to that at my office job a few years back. how about no...
>>
>>103280463
>inb4 iT's AcTuAlLy InLiNe Styles
But that's the real, legit criticism. Answer why it's not.
>>
>>103283121
because => it's not an inline style, just n classes being applied
>>
>>103283197
>it's not an inline style, it's just a single-layer abstraction of inline styles
Okay buddy retard
>>
>>103283223
>*** Please be civil, notice the "Friendly" in the thread subject ***
you will never fit in
>>
>>103283248
>when I'm acting like my 70iq, plz be nice
No.
>>
>>103283267
you never belonged here, and you never will, turbo newfag
>>
>>103283303
>the most coping coper of all time is coping
>>
>>103280845
The current web app that I'm devving uses bootstrap and tailwind and I don't like it sorry. It's impossible to find where something is because of the generic/reused names; 1000+ components/views/pages/forms... and gay merge conflicts when the other dev changes the functionality and I need to change the style. It only works if you're a solo dev and make the thing from ground up following le best practices.
>>
File: ddf.png (1.13 MB, 1009x1048)
1.13 MB
1.13 MB PNG
/wdg/ is terrified of pic related
>>
>>103284354
I like bulma
>>
Frontend development is gay as fuck
>>
Should I just give up on pure JavaScript for my simple front end and use react? I've not even written that much and my code is already slowly starting to resemble Spaghetti.
>>
>>103266938
>preact higher than svelte
Theres no way
>>
File: Untitled.png (23 KB, 1920x943)
23 KB
23 KB PNG
I'm working on an e-commerce site, like a cheap clone of Amazon, as a beginner project. Why am I getting this error, and how do I resolve it?
>>
>>103287396
don't use create-react-app, it's long long long been abandoned. Use Vite with the react plugin if you want the closest alternative.

npm create vite@latest my-react-app -- --template react-swc-ts
>>
>>103287555
How does this work in the context of my existing project? I've been following a Udemy course for this project.
>>
>>103287894

Vite + the react plugin pretty much works the same way as create-react-app does so there isn't much friction, just know that there's a vite.config.js/ts for configuring Vite (which you will need to do if you have a React project). If you want to migrate your existing codebase over, you could either:

- copy all the files in a fresh vite project (I'd recommend, just in case you screw up your config/setup)
- or follow a guide like the following: https://dev.to/henriquejensen/migrating-from-create-react-app-to-vite-a-quick-and-easy-guide-5e72

The only differences you should be aware of, on the top of my head, is the use of `import.meta.env` instead of `Process.env`. So places where you have `process.env.REACT_APP_xxxx` should instead be `import.meta.VITE_APP_xxx` and update your .env accordingly.
>>
>>103287963
I don't quite understand all of this, but I guess I'll give it a try. But regarding the error in my image, what's that all about? After I installed Axios and set up a proxy, I started getting that error.
>>
>>103288002
That error is to do with create-react-app's build system using a static analyser called ESLint and typical windows file permissions issues. ESLint is there to warn you of code patterns that you maybe shoudln't be doing.

You may want to delete your node modules folder and re-install. Vite doesn't use ESLint though so you wouldn't have had this in the first place.
>>
>>103288018
Alright, I'll take a look. Thanks. Are there any quick, ELI5 videos that explain the technical stuff behind React, Node.js, etc.? I feel like I'm a bit in the weeds trying to understand the "how" behind my code.
>>
>>103288018
If I were to keep working on my project using create-react-app, would this error affect anything, or is it just like a "suggestion" thing?
>>
>>103288043
For react, a good starting point is their learn section here: https://react.dev/learn
and the react foundationals course from next.js: https://nextjs.org/learn/react-foundations
Not sure for node.js, don't bother about learning build tools either just know what they do.

>>103288054
Not needed. It often can prevent builds from succeeding and there's no real way to configure create-react-app which is why everyone's basically abandoned it. Vite is just much faster, has an order of magnitude less dependencies, and less error prone.
>>
>>103285231
>pakificial intelligence
>>
>>103288075
>For react, a good starting point is their learn section here: https://react.dev/learn
Dear god, that thing especially including the thinking in react and tic tac toe tutorial are atrocious. That is like the worst code one person can only ever write if you were not know anything at all about html and js - in which case it would be even worse to jump to react directly.
>>
I just did my first AI chatbot with OpenAI API, to control a financing platform. This shit is really cool.

But LangChain is absolute cancer. Do not dare to touch it, fellas.
>>
>>103287963
>import.meta
wow, you learn something new every day, i was using some shitty hacked together dotenv script to set up vars using env vars in my vite config but not anymore i guess. thanks
>>
>>103287251
The graph shows Svelte overtaking Preact in 2020, and Svelte has increased its lead since
>>
thread theme
https://www.youtube.com/watch?v=oMRgdpXLElE
>>
>>103288075
Alright, I'll take a look. How did you know I was using create-react-app from my screenshot?
>>
How exactly do you deploy a non-static application to the internet? I have never deployed anything. I am developing an application that uses AI and I would like the structure (not sure if this is the right term) to not be scattered across services and whatnot, so I'd like to run both the back-end and the AI model on the same machine. I have already developed the landing page (the only front-end part) in React, and I would like to integrate a back-end now. Am I supposed to rent a server, then what? I do not know much about web servers either, should I install apache on it? I'd like the backend to be PHP since I have some experience with it
>>
how would I integrate a vite/react project into django
>>
File: chrome_3YgJOUzBK7.png (1.64 MB, 3840x1970)
1.64 MB
1.64 MB PNG
I've spent the past week making this battle royal simulator, pic related is the admin panel
https://witcheffect.com/thunder-dome/
https://github.com/UnderscoreNorth/Thunderdome-Fantasy
>>
In 5 years no one will code the web anymore. It all will be AI generated shit.
>>
>>103293921
This is what people said back in 2002 when FrontPage was a thing. Then it died in 2003 and WordPress started gaining popularity. So people said the exact same thing because WordPress exists. Yet web devs still have jobs outside of WordPress.
>>
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in `& {}`.

I don't get it
>>
File: homuclap.jpg (170 KB, 1280x720)
170 KB
170 KB JPG
>>103293155
this looks cool nice job anon, does the game eventually end if i leave the tab open?
>>
>>103294355
Yes, though a new one will start after 15 minutes of a game ending
>>
>>103293921
Maybe society will keep requiring programmers, unless there's some big war or something which makes society revert back to primitive levels of technology
>>
I have a variable
const form = document.getElementById("new-post")

But when I type
form.reset()

VSCode intellisense does not show reset and autocorrects it to
orm.requestFullscreen()


It absolutely works and clears all the inputs but I have no way of typing it with intellisense enabled
I have to literally copy and paste it

How do I make it less retarded?
>>
>>103298153
reset() doesn't exist on HTMLElement but exists on HTMLFormElement
at runtime it'll just work because you know you're targeting a form element, but intellisense doesn't know that unless you cast, assuming you're using typescript
>>
>>103298153
You gotta tell vscode what kind of element it is.
const form = /** @type {HTMLFormElement?} */ (document.getElementById("new-post"))



[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.