/wdg/ - Web Development General

Non-Regular OP here, sorry for messing up some of the threads a few months ago. I've gained enough confidence to open a new one, with the superior /wdg/ picture.

Previous thread: >Beginner Roadmap and Overview
github.com/kamranahmedse/developer-roadmap
youtube.com/watch?v=UnTQVlqmDQ0

>Free beginner resources to get started
Get a good understanding of HTML, CSS and JavaScript.
developer.mozilla.org/en-US/docs/Learn - a good introduction to HTML/CSS/JS and Node.js or Django
freecodecamp.org - curriculum including HTML/CSS/JS, React, Node.js, Express, and MongoDB
javascript.info - curriculum providing a strong basis in JavaScript

>Further resources
developer.mozilla.org/en-US/docs/Web - excellent documentation for HTML, CSS & JS
hackr.io - crowdsourced collection of tutorials from across the web for learning languages and libraries (ignore sponsored stuff, look at upvotes)
learnxinyminutes.com - quick reference sheets for the syntax of many different languages (generally not sufficient on their own for learning something, but very helpful)

>Asking questions
jsfiddle.net - Use this and post a link, if you need help with your HTML/CSS/JS
3v4l.org/ - Use this and post a link, if you need help with PHP/HackLang

>PHP resources
pastebin.com/gfBPg24A

Attached: 1548205485074.jpg (824x553, 157K)

Other urls found in this thread:

developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
codewars.com/
codesignal.com/
getbootstrap.com/docs/4.0/components/carousel/
twitter.com/NSFWRedditImage

fuck javascript

fuck your mom

Laravel's notification/mailing system is a fucking disaster. I just traced all the fucking proccess taking place when you want to send a "notification"(mail) to a user. Holy fuck this is huge and complicated and shitty. Literally 20 classes and files are involved in this process.
They are calling billions of stupid shit just to create a random string (token) .

And even after accepting their shitty ways you get to the part when you want to customize your mail and holy shit its a fucking cancer. I had to hack my way through cancer so i can make my own mail template with blade instead of their gay retarded way with markdown and billions little pieces of shits that compose the mail. I mean this is the biggest cancer i ever saw in webdev, even javascript libraries and frameworks are not this much cancerous.

look at this wise guy over here

why don't you write a simple "notification email" system?

Wait at least for the 310 bump limit though OP
Is it because Laravel is partly built on top of Symfony and adds its own code into the mix or is it the same in both?

I wanted to write an international exchange platform aimed mainly at Asia like Grabr but better. Who wants to join? Might as well be a successful startup.

thats the whole point , why the fuck would you need a system for a such a simple operation
its bloated and unnecessarily complicated
and they are calling it "notifications" when its actual mail sending to users email address, fucking assholes
>Is it because Laravel is partly built on top of Symfony and adds its own code into the mix or is it the same in both?
i never used symfony but i think its less bloated and it demands you to write more your own stuff while laravel is treating you like a retard

how do I get a positional value of a CSS element in vw?
Like, img.style.top but in vw instead of px

I don't think you can do img.style.top, try to use:
developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

instead.

sorry, I mean this:
developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle

Convert img.style.top from pixels to vw?

how do I do that? Sorry I'm new pls no bully

Do you think that PHP will die in our lifetime?

I think it's something like
img.style.top / window.innerWidth * 100

thanks frend

img.style.top includes "px", so you need to use parseFloat(img.style.top) instead. Also, this only works if your unit for style.top is px.
Also I'm not sure if that equation is correct, I'm a bit drowsy atm.
Basically vw means "% of viewport width". So just convert a pixel value to the right % of viewport width.

>using react/other javascript frameworks

lmao

Any real coders here that code on pure manly javascript?

>code
>javascript
kys kid

Me. Although getting a frontend job without knowing any frameworks/libs other than jQ is pretty fucken hard.
In personal projects I don't use anything but my own code (except for time/date stuff and codemirror)

Does it exist none popup box version of prompt, confirm and alert in javascript?

I finding that popup boxes can be annoying if you are gonna make simple text adventure games.

make your own

>displaying a popup
>casting a transparent bg over your content
ez
>pausing every process running
uh

>i never used symfony but i think its less bloated and it demands you to write more your own stuff while laravel is treating you like a retard
Pretty much this, while laravel is ridden with helper functions and eloquent is a magic black box, symfony replaces it with about 400 lines of yaml/annotations/xml.

From my somewhat limited experience, you can write very good code with laravel, but it's much much easier for retards to write shit code.

Not sure how serious you are with that post, but frameworks and libraries are a thing for a reason.
If I want to build a site and rather care about implementing the sites functionality and not the underlying mechanic of how to go about updating html elements, then why not make use of a well tested and performant library, that multiple people put endless hours in already to get it to this point.
I'd rather criticize people blindly copying snippets from stackoverflow and other places without having the faintest clue of what they are actually doing and just hacking together some frankensteinish abomination.
Everyone's time is limited and it's impossible to maintain code covering all the various use cases just by yourself.
>pausing every process running
that should be the responsibility of your game loop then instead of relying on some blocking JS somewhere else.
good job being mad about people using a programming language

Spent the day fixing my bullshit from a few weeks ago. It's my fault for listening to people.

What happened?

I'm maintaining an enterprise WordPress site for a business.

I need to unobtrusively notice people about news. This has to be done on the landing page, and there's no news section.


I'm looking for some floating infobox or something similar.

Anyone have any recommendation/suggestions?

>anime picture
Thread ruined, please make a new one. You are like furries.
“Durrr I like autism cartoons, so everyone should look at my autism cartoons!”

Stay unemployed.

Ask the developers of Laravel, retard

Sure, but meme languages like Ruby and meme technologies like React will die long before PHP.

Bump

Why can’t I use regular Javascript directly in an Angular component’s template file? getElementById() doesn’t do shit.
Just playing around and learning here, but I feel like it should work.

4channel is a website for anime enthusiasts though.
Naturally, because something new and more useful will come along.
jQuery was incredibly useful when it came out, but now it has been succeeded and better options are widely available.
Don't understand why you'd refer to frontend frameworks as a meme. Their benefits are undeniable over what came before them and even the libraries themselves evolved very much from their initial release to their current version.
What are you looking for exactly?
Good looking design examples or just how to write the CSS for an element floating above the rest of the site?

Pick the most eye catching accent color that site has, if it doesn't have any go for a green or light blue-ish. Put the text there, animate it from the bottom right corner to pop up vertically animated with a transition, that's it. Alternatively install pop up plugin, top kek.

not an expert, but I think it's because it doesn't allow you to fuck around with other components outside the component's context, imagine changing the color of an element from another component, good luck finding where the fuck the code is, also the div that you want to get with getElementById might not be rendered yet

>have to do something
>oh no this is going to be so tiresome, it's gonna take hours
>done in 10 minutes
>have to do another thing
>etc.

god fucking damn it, if I didn't have this false perception about how long things are gonna take, I could be employed by now

>stressing for 6 hours
>about a task that turns out to be 10 minutes long and maybe 4 lines of code
I know this feel

Working on a game using phaser 3 for the web/mobile. was wondering if anyone could help me solve this:

So i'm trying to make my game unload a bunch of un-used resources. It's proving to be a lot more complicated. here's my code:
var meteor = this.physics.add.group();
this.physics.add.collider(meteor, sput, deathControl, null, this);

meteorSpawnFrequency = 500;
setInterval(spawnMeteor, meteorSpawnFrequency);
var meteorCap = 0;

function spawnMeteor() {

//Create Meteors
meteorCap++;
meteors = meteor.create(Math.floor(Math.random() *800) + 1, 30, "meteor");
//Edit Meteors
meteors.depth = -1;
meteors.setVelocityY(500);
meteors.setScale(Math.floor(Math.random() * 2) + 1);
meteors.setCollideWorldBounds(true);

//Destroy meteors after the cap reaches 10
if(meteorCap > 10){

meteors.destroy();
console.log("meteors destroyed");
meteorCap = 0;

}
}

I'm using an interval to spawn the sprites, and all of it works just fine. What I'm trying to do is set a cap that when 100 meteors are present, they'll get destroyed, and the cap gets set back to 0, to repeat this process. Only problem is it's not working. How do I get this working?

does it keep adding meteors?

console.log meteorCap right before the if statement

Yes, it's only deleting the meteor that spawns right at the cap, if that makes sense

>meteors
I guess the meteor.create() function returns the meteor to this variable?
So it will only ever hold the most recent created one.
I don't see any array in there keeping track of all the ones you created so far.

How would i create an array to keep track of this? I'm so confused man, i've tried everything.

The game is turning out to be something i'm very proud of, but it wont matter if the game crashes after 500 meteors are spawned :(

>Working on a game using phaser 3 for the web/mobile.
>How would i create an array to keep track of this?
you can't be serious user

Attached: 1542762279155.png (348x301, 75K)

start with an empty array:

let meteors = [];

create a meteor and push it into the array, if one meteor gets destroyed, meteors.filter() it out, if you want to destroy all meteors, clear the array, if you want to know how many meteors are there, meteors.length

can someone please help?
the firefox console won't let me change this attribute because it has a dash in the name

Attached: fucking.png (518x229, 39K)

I'm just confused, cause I dont think the meteors are something i can easily push to the array. but maybe im just confused.

Ok, ty. I'm gonna give this a shot.

use attributes['aria-disabled'] instead

are you using dvorak?

thanks and yes

create() returns a reference to the meteor object right? Why wouldn't you be able to push that to an array?

// somewhere outside the spawner
const meteors = []

// in the spawner
const newMeteor = meteor.create(Math.floor(Math.random() *800) + 1, 30, "meteor")

// if above meteorCap
for(let meteor of meteors){
meteor.destroy()
}
meteors.length = 0
// or make meteors a let variable and assign a new empty array or just pop the meteors off one by one idk


But you generally know how arrays work in JS?
Just confused, because creating a game in Phaser is definitely much more advanced than doing fundamental array operations.

forgot
meteors.push(newMeteor )

but you get the idea

holy shit that worked...
And no im not really a good programmer when it comes to javascript. I'm using phaser so i can start getting more in depth with it.
I've learned a lot, but never really expected a need for using arrays in this game.

Thank you for your help!

Download an introduction to programming course somewhere, it'll teach you the basic algorithms and pieces of the puzzle, like integers, floats, characters, strings, arrays, something you don't have in js but you are using unknowingly

when you are working with arrays in javascript, pay attention whether you are working with the initial array, or if you are creating new arrays and leaving the old ones in tact,

for example, the function slice, if used on an array without any parameters will return a new exact copy of that array, so you can work on the copy instead of modifying the original array, it helps with keeping history,

the functions map, filter, forEach do the same

I like learning hands on, even if it leads to moments where I feel like im about to give up. But i do have a javascript book somewhere. I just haven't read it much. I used it a bit for simple web development a while back.

Thank you for the advice! I'm also gonna hit the docs, and learn the array methods more, so i can understand what the code is doing a little better :)

for raw language knowledge and some algorithm practice I found those code challenge sites very useful. For example:
codewars.com/
or
codesignal.com/

Ill give them a look, thank you!

You are programming without knowing how programming works, you'll be much more proficient knowing at least the basics.

What are basic projects someone just starting programming can do? I'm using a front end based language

What languages are you using?
Build a calculator, or something that makes your day a little easier.

I've built a site up, from user registration to the point where the users can do the stuff I wanted to implement, it's so beautiful to see the site at an advanced stage, but at the same time I feel like throwing my laptop out of the window.

i'm looking for a css/html slider whose slides are just html content. i would like to have a 'row' div with left and right arrows that changes content when i click the arrows. is there such a thing?

redpill me on apache2 vs nginx

Elm
I've found some books

redpill me on serverless, what the fuck is it even

oh word never mind i found it naitive to bootstrap

getbootstrap.com/docs/4.0/components/carousel/ I guess this would be it

there might be a crazy non JS alternative to that, but generally speaking, you'll need JS for that, there's a fuckton of templates online if you can't figure it out on your own

yeah JS is a given, i should have been more clear but i found a solution in bootstrap itself which is convenient because i'm using it for the layout. thanks for your reply anyway

I googled it for a bit because the website I built for a friend only needed a contact form and I wanted to use a serverless option to see how it goes. I guess it's just ajax calls you send to the server, that you can use but don't have to manage. I ended up not using it, because my friend had some hosting paid and I didn't mind writing a few lines of php code.

It's like Cloud 2.0, you upload a function and when someone visits a URL your function will run and you pay each time.
I wouldn't really recommend it unless you have a really good use case for it, if you fuck up and make a never-ending loop your wallet will hate you for it.

these memes are getting too far

my site uses geolocation heavily which works fine on desktop but on mobile I get >Only secure origins are allowed (see: SOME GOOGLE LINK I CANT PASTE HERE)
in chrome and
>User refused geolocation prompt in firefox
without actually prompting me, How should I go about testing geolocation on mobile?

I think you basically just have to fake it for testing on mobile until you actually set up a server with SSL.

You could use something like ngrok if you don't have a server to test with.

I think I'll just deploying it to my server, having a proper staging environment might be useful I guess?

Quick rundown on Next.js vs just React???

Attached: anime question.jpg (433x380, 25K)

next.js is server side rendered react

Yeah, I know that. What are the benefits, though?

gotta admit as a Laravel dev it is. the notification system needs you to have some sort of scheduler like pusher or forge or cloudflare if you want to do anything practical with it. i don't know why it is so hard to just queue shit and use a scheduler without all this bs.

> anime edition
user, you have failed me for the last time

Why do these dumb faggots not make fonts properly and set the metrics so they work on both systems

Took ages to figure out it wasn't a browser issue today when on mac chrome and IE show a massive difference in alignment

Attached: 9kvarB[1].png (644x391, 184K)

Site can be used with or without clientside JS, so no issues with any old browsers.
Same when Googlebot fetches your site, so possibly better SEO, if you otherwise have some newer ES features, that Googlebot can't handle well.
'potential' quicker first paint in the browser, since the client receives the rendered HTML and doesn't have to wait for the JS to parse and take over. (if the server can respond faster than the client would take loading and rendering it from a nearby CDN)

Downside though, that you got to have a server to render your page and can't as easily take advantages of CDNs that would otherwise host your static files.
Also the development can be a bit more work, since you have to differentiate between server and client lifecyclehooks and how one may have to render something that the other doesn't.

This is just from my experience with Nuxt, but that should overall be fairly similar to Next.

They probably picked system native fonts, so the result is the difference of how two different fonts behave, this wouldn't have happened if they attatched the font to the web?, but by doing so you're compromising bandwith and performance.

>They probably picked system native fonts,
what do you mean? these are custom made fonts im talking about

shocking, for some reason they changed the font weight of the font in one of the cases, probably what caused the miss alignment, just a poor UI work

Common issue with custom fonts, you're probably loading two different font files for IE and Chrome and one of them is fucked up. Just google how to fix it.

have anyone of you guys used HubSpot before? The company I am working with is planning on using that CMS but I had bad experience with shit like Wordpress.

If I build a small CMS... will people hire me?

If you want to be a dedicated CMS pajeet, look into upwork.com. Demand for Wordpress sites is huge.

>fresh install of ubuntu
>create sudo user
>install npm
>version for the user isnt the same version as the one for root
???

Yes.

Building a CMS is hard though

T. Guy building CMS for 3 months here

Where is the weed guy?

What do you use to process payments that are easy to setup for the stores?

How do you find time to learn stuff after work?

im a junior and get so fucking tired or feel like im wasting my day after i get back home from work at like 7 then i eat and shitpost and sleep before 10

before getting i job i used to have whole days with 3 hour chunks i would use to learn shit

Slack off at work more.

I'm dead serious.

I said build a CMS not use a pre built CMS

Thanks for giving me hope mate. I built a small CMS that uploaded text and pictures into a slider once. I don't even remember how I dealt with the images to be honest.

>generate basic app with 1 command
>generate database and set it up with 1 command
>automatically generate html, css, forms, controllers, migrations and everything in 3 commands in the console

Attached: cutie.png (225x225, 7K)

And where are you? We work on a CMS and are hiring.