/wdg/ - Web Development General

Previous Thread:


>Free resources to get started
Get a good understanding of HTML, CSS and JavaScript.
MDN web docs offer a good introduction (independent of your browser choice)
developer.mozilla.org/en-US/docs/Learn
freecodecamp.com/
codecademy.com/

>Further resources
developer.mozilla.org/en-US/docs/Web - General documentation for HTML, CSS & JavaScript
github.com/kamranahmedse/developer-roadmap - Roadmap
stackoverflow.com/ - Developers asking questions and helping each other

>Tools
jsfiddle.net/ - Use this and post a link, if you need help with your code
caniuse.com/ - Check browser support for front-end web technologies

Attached: wdg.jpg (250x140, 5K)

Other urls found in this thread:

jsfiddle.net/#&togetherjs=9mEaNvER0V
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get
udemy.com/the-ultimate-mysql-bootcamp-go-from-sql-beginner-to-expert/
curl.haxx.se/
npmjs.com/package/http-server
codesandbox.io/s/heuristic-haslett-1k2px
twitter.com/SFWRedditGifs

jsfiddle.net/#&togetherjs=9mEaNvER0V

Thoughts?

Has anyone invented an alternative to electron that isn't fucking awful for the end-user?

I want to look like a hacker while doing webdev shit. What do you guys think about Vim? Been watching a few videos and it looks neat but I don't know how much of a hassle it would be to set up an environment for web development specifically. Do things like linting, intellisense or code completition even work with Vim?

I've heard NativeScript is great. Planning on using Angular Native

Grow up.

is flex only useful for creating navbars? its options seems quite limited so i don't know how could i make anything semi complex with it

retard.

You mean like Flexbox?

It's great for making fluid webpages. I suggest looking at the column system of something like Bulma or Bootstrap. Basically it's good for resizing and remodeling shit based on screen width, so you don't have to build several versions of your site like desktop version of your site, tablet version, mobile version, etc

>cares more about looking like a hacker than functionality by asking about a thing he's never used before
>calls others retard

Grow up

He's clearly asking about the functionality, though.

And yes Vim can do anything any meme IDE can do and better.

Here's a site called instasync.com made by a genius and handsome man named mewte. that makes good use of bootstrap's flex. Note how when I resize my browser the chat and playlist start shrinking and eventually get pushed under the video?

It works perfectly on mobile without the need for a mobile site due to it resizing with the browser size.

Attached: cinnamon-20190812-1.webm (1366x768, 2.59M)

Oops wrong video. That was for another thread to show that gifv isn't a real thing and is just imgur jewing you mp4s.

Attached: cinnamon-20190915-2.webm (1366x768, 1.4M)

Is there any reason to use ES in node in this day and age? Modern javascript has just about everything ES does short of export.

const _composer = (acc, f) => f(acc);
const compose = (...fns) => (...args) => fns.reduceRight(_composer, fns.pop()(...args));
const pipe = (...fns) => (...args) => fns.reduce(_composer, fns.shift()(...args));


Very cool.

What's that do?

Composes functions.

Instead of doing this
const funcComp = lastFunc(secondFunc(firstFunc(argument)))


You can do something like this

const funcComp = pipe(firstFunc, secondFunc, thirdFunc)

funcComp(argument)

Is there a way to make prettier not change the way I set up my asignments?

var one = "1",
twoT = "2",
sd = "skdj";


It messes them up every time

Fuck, but you know what I mean right have the = signs all lined up and also if I'm only using a var keyword and separating them by a comma I want the names to be lined up as well.

You don't need a comma there. You can just make them each individual. In fact I don't know why you don't.

in js, can i write a get/set on an object in such a way that it binds to all properties?

What do you mean?

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get
you have to choose the specific property it binds to. can i have it with some kind of wildcard?

Unless you're using non-strict js you do need comma

That's not what I was saying. I was saying you could declare them individually if you were worried about looks for some reason.

const one = "1";
const twoT = "2";
const whateverthefuck = "niggerdicks";

Wildcard as in you want a random item from your object?

And that's also not what I meant, I declare them like so because I like it, but Prettier, as in the plugin that cleans and arranges my code, doesn't recognize it and just fucks shit up.

Attached: 91827.png (356x115, 15K)

no, imagine something like this:
const gayObj = {
a: 'foo',
b: 'bar',
get [*](value) {
return value.toUpperCase()
}
}

console.log(gayObj.a) //FOO
console.log(gayObj.b) //BAR

i imagine it can't be done this way, i'd have to write a wrapper around the object, since i can't find any info on google.

Is Svelte a meme? I think about it as not bloated React/Vue, basically Vanilla JS but a bit "more" but not total rocket-science shit like other big frameworks( that i like, React is fun as fuck for me, hate Vue). It looks nice, should i try it?

Attached: 4453453454.gif (162x226, 777K)

Why would you even want to do that? Debugging something with functionality like that would be a massive pain.

I have no idea what you're even trying to do with that wildcard there. What's wrong with just console logging gayObj.a and cutting out the get inside if that's your goal?

Just FYI user, you don't mention what you are trying to achieve and when I follow the link I end up on an empty jsfiddle.

i'm trying to avoid having to use external getters and setters all the time with this particular object. it's important the gets and sets are done in a specific way or it'll break shit, so i figured putting it into the object itself like this was safer. i am however a smoothbrain pajeet.

>just console logging gayObj.a and cutting out the get inside
the point is the get bind to every property without having to bind gets to each one manually as new properties get added. if i have to bind the get to each one anyway then i need a function to handle adding new properties, and i'm back where i started.

>vim
I got started on Vim and kept at it. The learning curve is steep but once you're used to it, I feel like it's something you can customize much more to your needs. For example Vim has its own language called Vimscript, which you can use to tell it to do this or that. For most things that you'd like to have, there are plugins. It's major force is that after a while you start thinking in it, for example gg brings you to the top of the file, G to the bottom, i starts you typing where you are, A starts you typing at the end of the row, etc. You just stay with your fingers on the keyboard and don't need to grab your mouse to move around, click on something, write, grab the mouse again, etc like with another editor.
Now, that being said, it's also being overblown as a l33t haxxor things. I think you can just stick with visual studio code and be fine.

Flexbox is useful for responsive websites and for arranging things properly without needing bootstrap. It should be combined with grid and sass though. Or you just ditch it and go for bootstrap.

nigger just use a foreach loop and skip adding a gay fucking object inside your array then.

I don't know what kind of dark magic you're doing that the simple use of a getter/setter would break your code.

>Want to create a backend for my websites in .NEt-Core 3.0
>Uninstall my netcore 2.2sdks and other shit
>Go to the netcore page
>Netcore 3 releases in 9 days
REEEEEEEEEEEEEEEEEEEEEEEEEEEEE
Guess it is front-end for the next week(s)

i guess i'll just continue to do the retarded stuff i'm currently doing

The reason that mozilla example works is it's using an array for the latest.

If you turn log in the mozilla example to an object, it no longer works var obj = {
log: {a:'a', b:'b', c:'c'},
get latest() {
if (this.log.length == 0) {
return undefined;
}
return this.log[this.log.length - 1];
}
}

console.log(obj.latest);


Can you switch your gay object to an array if needbe?

what sort of faggotry is this?

Fuck off nigger we don't use that offensive language here

just make it a function and pass in the keys as arguments if you dont want the variables to be publicly accessible.

Getters can't accept values

I mean arguments, if you want to modify a property when you request it you should use a method instead of a getter.

Is the AWS developer certification worth getting? I'm already an employed full stack developer, but I want to get a remote job and need something to make me stand out from the competition.

Attached: question.png (741x568, 29K)

yeah this is what i'll do instead i think

was just pseudocode trying to describe what i wanted to do. value was intended to be the value of whatever property you try to get. you're right that i should just go with a method, since this way seems to be impossible.

the gay object needs to be an object.
this isn't actually what i was trying to solve but i think this would work, though maybe order of keys in an object isn't guaranteed:
var obj = {
log: {a:'a', b:'b', c:'c'},
get latest() {
if (this.log.length == 0) {
return undefined;
}
return this.log[Object.keys(this.log).pop()]
}
}

console.log(obj.latest);

Getters can't accept parameters. However you could just add a function in to your object easily like so. I'm still not sure what your end goal is but here's an example of a function inside of an object.
var obj = {
a: 'foo',
b: 'bar',
c: 'nigger',
wildcard : function(fuckyou) { consolelog(obj.fuckyou); }
}

fuckyou is the parameter, so now you can do .wildcard() as function and whatever you put in will be what it gets.

Such as obj.wildcard(a), which would return foo

seems it's necessary. my end goal was to avoid using a method because in my actual code, if you set without doing certain things first, it could break shit. so i wanted to force the right procedure in the set and make it transparent, so it's impossible to fuck it up. seems a method is the only way though.

Should I?

udemy.com/the-ultimate-mysql-bootcamp-go-from-sql-beginner-to-expert/

I took his web developer bootcamp course and I was pleased with it for the most part, I just didn't like the fact that he resorted to cloud9 instead of using a real work environment, and I think it does the same in this one.

Attached: 1435497222508.jpg (441x411, 26K)

>use windows with veracrypt
>drive dies at random updates
>use ubuntu
>shitty driver support and need a thousand hacks to make things work properly
>use mac
>you can't do anything anymore
I've decided all operating systems are a meme. I think I'm going to do webdev on good old fashioned pen and paper instead.

The guy makes pretty good videos. But I usually prefer websites or pdf files above videos.

install gentoo

I usually like them after using some video as introduction.
For 10 bucks could be a good intro and I really need some hand holding right now because my discipline isn't at its best.

>payfag
leave

Some stupid recruiters actually care about certificates even from Udemy.

Why would you remove old SDKs?

Is there a way to stop codesandbox.io stop auto-executing code the moment its typed?

JSbin is nice that you can use ctrl+enter to execute code, does something like that exist for more complex online ides? Thnaks,

nvm, figured it out.

You cant be serious

using websockets. all the stuff i did so far was publish/subscribe type.
now i need the client to request some specific data from the server (i can't just send it all to the client, there's too much). of course websockets isn't like http so i'm not sure how to link the request to the response on the client side.
can anyone point me in the right direction?

I'm not him, but of course that's the case. A degree, certificates and work experience do not show what you can do, but they do show what you have done in the past. So it's a good way to assess what a person is capable of.

Do Udemy instructors have any sort of credibility? I thought anyone could just make whatever bullshit course they want.

You can still do normal GET requests in addition.
That's usually how I like to do it. Unrequested streamed data via the socket and explicitly requested data through normal AJAX.

Are you using raw websockets or a library like socket.io?
When you receive the socket message, you should have the information which socket it came from and therefor know where to respond to.

>You can still do normal GET requests in addition.
good point. this is a good solution for some of the data i have, however other data needs to update in real time so would still have to go through websockets. polling sucks.
i'm using socket.io, it's working nicely so far.

>information which socket it came from
not sure what you mean, sorry. there's only one socket server. i suppose my issue is i'm not sure how the data would get directed to the right place in the app, once received. how should the socket handler know which place to send the response data. hopefully that makes sense.

What is a cURL request? Can it be done in javascript?

curl.haxx.se/

i mean, when a client connects, you know which socket belongs to him and you then set a listener on that socket I guess?
So if someone sends a message on that socket, then you can reply on that socket as well and have it go to the right client.

So you are using raw websockets, right?
Not an expert and I mainly used socket.io in the past, but I imagine, that it works very similar with raw sockets.

>I want to look like a hacker while doing webdev shit.
GNU nano

I'm trying to learn about modules but I can't get them to work, I get the following errors, can someone help me out?

>Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/Mark/Desktop/dev/script.js. (Reason: CORS request not http).

>Module source URI is not allowed in this document: “file:///C:/Users/Mark/Desktop/dev/script.js”.

Pic related its literally this simple. I tried online code editors it doesnt work at all...

Attached: Capture.png (1920x355, 51K)

use a server

npmjs.com/package/http-server

codesandbox.io/s/heuristic-haslett-1k2px

It works fine, Mark.

import.meta doesn't work though (following that javascript tutorial)

oh, hi mark!

This is what I've realized so far as well
Any certificate is better than nothing.

Use express for serving things on backend
const app = require("express")
const cors = require("cors")
app.use(cors())

Will I do it this times, will I find the strenght, endurance, perseverance and dedication to do my homework every day, will I finally become the 1338 M45732 of PostgresSQL?

Attached: 1560701094602.jpg (516x440, 124K)

Is there any way to integrate a web view into visual studio? Kinda like how codesandbox is , but offline.

Visual studio or visual studio code?

setState() works when I use it on any onClick-able element, but doesn't work in class methods and doesn't throw any errors.

Any idea why this behavior occurs?

Attached: memer.png (1913x1073, 1.05M)

show code

Please tell me one of you use Django, I can't figure out this signals shit

sorry i wasn't clear.
i'm using react, the socket connection and received data is all in the root component.
when the client requests data it would need to be routed down to the correct component in the tree for display.
let's say the client requests data for viewing a user profile, the response arrives, and i put it in state as "currentlyViewedProfile".
then i can pass that all the way down manually to the component that displays user profiles.
the issue is for every request/response type operation i need a new state value and i need to pass it all the way down.
let's say i now want them to request the friend list of another user. now i need more state values in the root component, more props, it gets messy quickly. it's not very extendable.
so the question is, how can a component further down in the tree request and receive data in some way that the code can automatically pass it down to the requesting component? with http i could just make the request directly in the component that needs the data.
i feel there's some fundamental concept i'm missing here.

what exactly

I have a CustomerUser model, and then a profile User model. The profile model has a OneToOne relationship with the CustomerUser, so one CustomerUser to one Profile, sounds simple enough.

Then in my signals, when a User is created, I also want a Profile to be created as well, but I can't figure out how, and there is not much info online about signals and anything beyond the default Django user.

1) use rest to load static data
2) you can also use sockets, you can open as many datachannels as you want desu, and use a different channel for each module
3) use a multiplexer with fake datachannels such as stomp or socket.io, or build your own where you mux&demux with the first byte or something.

I need to use machine learning to predict wait times based upon day and time of day.

What's the best way to do this? Anything in javascript? I could just store in a db and average the wait times but not sure if machine learning is faster?

>with http i could just make the request directly in the component that needs the data.

make the websocket a global object or service or something, then you can access it anywhere

you using angular or react or something?

KISS

try it with historic averaging and see whether that's good enough

then you can go back in and work on your model with forests or grus or some other bullshit. but if you need to ask, this is significantly over your skill level desu.

put all your socket stuff into a file like socket.js or something and then just require() or import it wherever you need it and have every component handle its own socket communication

>make the websocket a global object or service
i'm a bit of a brainlet, but this sounds like exactly what i want, can you elaborate on how i'd do that? yes i'm using react.

i really am a brainlet, i just realised i'm not trying to get request/response at all.
it's pub/sub. the client needs updates as the data changes. i'm just confused about how to manage the data once it arrives at the client.

Revery is cool, built with ReasonML. There was another one recently I can't recall as well.

oh fuck you're right
never mind lads

Only machine learning is over my skill level, which is why I'm asking.

I'm going to average historical.

There is no such thing as a private property in JS in the true sense of "property" (it can be emulated with closure values as another user implied). You don't need to make your code impossible to break by other developers. Having sane code that is easy to read is more important than perfect encapsulation.

To achieve what you want, you can either emulate private properties by using a closure or you can return a Proxy instead of the actual object. That way you can control all get/set/call access on the entire object. Both are pretty shit since your reason itself is pretty shit.

No.

I have been studing on my own for 10 months, probably a total amount of 2 months I did absolutely nothing, and I feel I've been running in circles.
Going to start hardcored mode with MySQL and PHP tomorrow sincer there's a fuckload of demand in my area.
I wish you luck as well.

>react

maybe there's your problem

are you getting confused by ALL THAT STATE?

well react's a shit, that's why they invented flux/redux. see if that can help you?

consider typescript

the problem with machine learning, especially if you're inexperienced, is that you can quickly sink a lot of time into solutions that sound promising but won't solve your problem.

and yes, you can run tensorflow models in js

>ALL THAT STATE
the amount of state is minimal.
i was confused about how to structure the data flow.
now i know to just put the connection external to all components so anyone can connect to it, it'll be easy.
you might be right about redux however.

Don't take this as a standard, but here's the way I did it.

I put the socket inside of the redux store and I'd connect a component to it if I need to emit something from that component.