>Getting started
Get a good understanding of HTML, CSS and JavaScript.
MDN web docs offer a good intro (independent of your browser choice)
developer.mozilla.org
>Free online courses
codecademy.com
freecodecamp.com
bento.io
>Roadmap
github.com
>Resources
developer.mozilla.org
stackoverflow.com
caniuse.com
>Youtube channels
youtube.com
youtube.com
youtube.com
youtube.com
youtube.com
>in-depth comparison of VPS hosts
webstack.de
Other urls found in this thread:
news.ycombinator.com
github.com
github.com
github.com
github.com
unpkg.com
github.com
github.com
github.com
pastebin.com
github.com
jsfiddle.net
jsfiddle.net
jsfiddle.net
pastebin.com
twitter.com
>Help me. How do I make the following code print 8 instead of 4?
function () {
var x = 1;
var y = 1;
x = 3;
Promise.resolve().then(y = 5); // some async call before setting y = 5
console.log(x + y)
}
new Promise(
(resolve, reject)=>
{
x=1;
y=1;
x=3;
somethingAsync(
(err, five)=>
{
if(!err)
{
y=five;
resolve('is five now');
}
else
{
reject("not attributed, %s", err);
}
});
}).then(
(cool)=>
{
cool=='is five now'
?
// use five
:null;
},
(uncool)
{
// rejected
});
you have to scope out x and y though, cobbled it up together don't worry
either move console.log() into then()
or replace it with async/await I would say
Are you kidding? That answer is disgusting. I already posted the best solution.
function () {
var x = 1;
var y = 1;
var z = 1;
var p1 = Promise.resolve().then(y = 5);
var p2 = Promise.resolve().then(z = 2);
x = 3;
return Promise.all( [p1, p2] ).then(() => {
console.log( x + y + z); // prints 10 as expected
});
}
but does any code after that function execute until both promises conclude?
Shouldn't it be return await Promise.all...
>either move console.log() into then()
NO, because that's a hack unscalable solution. On top of breaking if you add another promise to the mix, it could also move the logical end of the method to the top of the function, which is insane. I'm sorry, but the last code to be executed should be at the end of the function, not in the middle or the top.
That is why my solution here is the best.
redpill me on vuejs
What function? If you're talking about function() itself, like
function()
console.log("hello, world");
// Output:
// hello, world
// 10
So, YES you can execute code outside the function before the promises are fulfilled. Or you can do
function().then((res) => { console.log("hello, world"); });
// Output:
// 10
// hello, world
So you have full control.
What does this mean? Anything I write with React doesn't belong to me?
It's good.
What do you want to know?
What about vuetify? Is there any better alternative?
I already know the basics of html and css but I find it hard learning js, any tips user?
There is this list for potentially interesting stuff
github.com
Personally I am fine with Bulma though
new Promise(
(resolve, reject) =>
{
Fucking gross, dude.
new Promise((resolve, reject) => {
Want to check out vue js but just the core and router is over 100kb.
Webdev was a fucking mistake. Somebody needs to nuke California
vue-router.min.js 18.45 kB
vue.runtime.min.js 58.4 kB
28Kb gzipped
am I being memed?
Do you usually serve non-minified non-gzipped JS?
First: lets just nuke California anyway
two:
github.com
github.com
50 + 60 kb
Sorry second link is supposed to be: github.com
No, if you launch a product that directly competes with facebook and try to sue them, you lose.
That's not the minified router version.
Though even using a non minified version, uglify or babilify would just shrink it down again.
github.com
unpkg.com
but yeah, vue-router.min is actually 24kb. Must have checked the wrong version
vue + vue-router = 2 files.
react +react-dom + react-router = 3 files
But with a loose definition of "directly competes with facebook", they own all my code right?
nope check the faq
They kept it so incredibly vague, that your average dev had no clue what's exactly going on with the license and no idea under which circumstances FB could or would revoke it.
In the time it took you to save that image, you could have read faq.
animate.css vs velocity.js vs animejs?
github.com
github.com
github.com
Whatever works best for you.
>literally every single developer job in my region is either PHP or C#
Fucking kill me.
I don't want to start a new language from scratch but I doubt any company would hire a remote worker with no experience.
>I doubt any company would hire a remote worker with no experience
I doubt that very much too.
all three, they are just animations. Take what you want and add them to your own css.
If you already know one or multiple languages, learning a new one isn't actually that difficult. The foundations rarely if ever change, instead just the details.
But, a company isn't going to hire someone who knows a bazillion languages but has zero real world applications of them. Learn php, create shit with it, and start applying.
I've used velocity. It's nice. Easy to nullify too.
julians really love animation huh
Thanks for the advice.
I'm inclined to avoid PHP for obvious reasons but beggars can't be choosers I guess.
working on an a "modern" imageboard
currently truing to add functionalities like up/down voting threads
any ideas/suggestion?
One button that points up.
Another button that points down.
Ideally somewhere in the vicinity of the image.
Finish the webdev learning path /wdg/
>HTML
>CSS
>Javascript
>...
What language you using? Reddit uses Python :)
i'll up/down voting for the threads only cause adding voting to comments would seem way too reddit-ish
i thought since it gonna be a small slow website, showing popular posts on the homepage would be interesting
any other ideas to implimant?
php,js and mysql, using a tiny parts of vichan/tinyboard for now until we write our own ( gonna be open source ofc )
>Vue/React
>Node
>ruby/go/c# or something else that's actually useful for back end that isn't cancerous js
It's not bad honestly, especially if learning it puts you at a better position in life.
Depends on what kind of webdev. If you'll be touching the front end, you should absolutely brush up on design theories and perspectives, for instance.
If you're working on your own projects and don't care about being hired or what have you, just knowing html, css, and javascript will accomplish pretty much everything.
Not claiming this is the correct path, but it was my path. I would feel comfortable developing just about anything.
Basic
> html / css
> javascript / jquery
> php
Tools
> gulp / sass / npm / webpack
Libraries, extra
> react/ react-native
> meteor
Graphics
> Canvas / webgl / three.js / svg
Someone please finally explain why JS is supposedly so horrible.
have you used it? honestly I just hate using it because it has so many terrible quirks (js-fags will tell you these are "features") and gotchas. It's like it's trying to be several different things at once.
Also, the callback hell is real which makes it fucking horrible to read.
Fun fact, all tools and languages called 'horrible' by Sup Forums aren't actually horrible and rather the user just doesn't vibe well with them. Which is fine, having your own likes/dislikes of things, but rarely is the tool/language/platform actually horrendous.
are you serious? I would normally agree but js tooling is actually fucking terrible and requires almost as much effort to stay up to date as it does to learn the language.
You just backed up my point. It's a system you don't vibe with due to requiring more effort to 'keep up', so you call it cancerous.
Just use create-create-app.
Anything more difficult than this is not worth learning.
i'm arguing that some systems are objectively worse to deal with (whether it's because of the community or the language or w/e). Objectively.
way to avoid my argument through criticism that has nothing to do with what I said
Also fun fact: people only use js because they are forced to. No one will use that piece of shit when web assembly arrives
It's not.
>have you used it?
yes.
Used some C++ and Python for small hobby projects in the past and now mostly JavaScript for webdev related things.
Don't really have complaints with any of these
>so many terrible quirks (js-fags will tell you these are "features") and gotchas
eh some are I guess, like implicit type conversion. Can be convenient, but also can cause an error if someone is unaware of it.
You mean things like 0.1 + 0.2 = 0.30000000000000004, typeof(NaN), hoisting, var/let scope, const object mutability?
Where is the line between quirks and normal learning of language syntax though.
>callback hell
That's just bad style on the devs part though?
Not like you can't make other languages hard to read with overusing certain concepts.
Promises and async/await exist for a reason.
feel like the JS defense force here..
/routes/users.js
var express = require('express');
var router = express.Router();
/* GET users listing. */
router.get('/users', function(req, res, next) {
res.render('users', {title : 'How are you senpai'});
});
module.exports = router;
/views/users.jade
extends layout
block content
h1= title
p users page
Particular sections inside app.js
var index = require('./routes/index');
var users = require('./routes/users');
&
app.use('/', index);
app.use('/users', users);
Pic related is the outcome of directing the browser to the url.
What could be the issue?
should I use pusher or socket.io if I want to create a private messaging app?
Post app.js, I have a feeling it may have to do with the path of the views folder.
Socket.io is definitely easier (never used Pusher) but I like Websocket package. I've read that socket.io is like the jquery for websockets
app.js
pastebin.com
Just noticed from your first post, in you app.js you declare '/users' for your users router, then in your user router, you add '/users' so the route is looking for 'localhost:3000/users/users'
Eh, honestly I feel type conversion/loose typing is more of a decision on JS's part than a 'fault'. You may dislike it, and that's perfectly fine, but calling it an objective 'fault' seems a bit of a stretch.
As for 0.1+0.2 != 0.3, I believe that's a consequence of floating point arithmetic in general, and not just JS.
Yes, callback hell can be a real pain. However, as user said, Promises and async/await do exist. I feel this is a consequence of the environment in which JS was created. It ain't JS's fault. He a good boy.
Got fucking lowballed for a frontend job. $90 for a full site design including several pages. I need the money anyways so I'm somewhat happy.
>No one will use that piece of shit when web assembly arrives
LOL
>Objectively.
Don't bother using terms you just can't understand.
router.get('/users' ...);
This actually matches '/users/users'. The first /users comes from the line
>app.user('/users', users);
So, you don't actually have a /users route. To fix this, put
router.get('/', ...)
in your /routes/users file. This will match /users.
Also, these functions (router.get(), etc) send responses (you call res.render(), etc), which means there is no need for 'next' to be passed in your callback. This is what next is for:
myMiddleware(req, res, next) {
console.log("hello");
next();
}
router.get('/', myMiddleware, function (req, res) {
res.render(index);
});
There's a chain of functions that router.get() calls: myMiddleware and then your function(req, res) callback. This callback is at the end of the chain, so it doesn't need a next. myMiddleware() is not at the end, so a next() call is needed to move the execution on to the next function in the chain, which is why you need to include 'next' in (req, res, next). See what happens if you comment out next(). Your server will never reach res.render(), so your browser will be waiting for a response forever. You will see the browser's loading spinner go on forever.
>BSD+ patent license
>software patents
what did they mean by this ?
>sql
>spring
>you should absolutely brush up on design theories and perspectives, for instance.
Elaborate on what you mean by this.
I'm working with HTML imports (github.com
My header has ~20 imports in it, and for some reason the last one isn't importing properly. If I move the last import in line to the second or first position it works fine, but any other position it won't import. The truly bizarre thing is if I move that last import statement up the list, the link that's now the last link still imports perfectly fine.
Anybody got any ideas?
5 imports is a lot, 20 is retarded
Your import is throwing an error and not loading or doing whatever hence why the position is irrelevant.
Typescript & observables.
Javascript experts, I need your help. I'm looking at the minified source of some abandoned browser extension and it basically allows you to control the volume of audio on the page with a mouse scroll wheel.
I'd basically like to reverse the way it behaves so that when I scroll the wheel up, the volume increases (and vice versa). Current function is wheel up, volume down.
Here's the function... I've beautified it as much as I could from the minified form:
(Sup Forums won't allow me to post the function here for some reason... even when enclosed with code tags.
Could someone tell me how to modify it so the wheel up increases the volume and wheel down decreases it?
I'm not a JS programmer and don't know how JS wheel functions work but by hunch is that I could just switch + and 0 signs on "b += c.gap;" parts... Anyone know for sure?
Thanks!
Yeah only first 12 lines matter.
Checks for chrome and Mozilla mouse movement so a is an event.
You can inverse the b += to -= to get what you want.
It is pointing to something obviously though so be aware of that when it changes volume.
thanks user! just wanted to make sure. I'll try it out as soon as I finish watching a lecture in my browser tab.
No problem, I checked again and e is referring to an embed HTML element. Only thing you can call setVolume on.
I'm using express js and mongoose/mongodb. i'm wanting to figure out how user profiles generally work. can someone help me?
Thanks! BTW, if you take a look at the code above, what is 'b-c.gap : b+c.gap' doing on line 3? should I change those around as well? line 6 & 7 is the obvious part to swap around...
Good spot.
Yeah reverse those + and - operators. The if statement does the same as the Else but executes when browser is chrome.
Mozilla and chrome have slightly different event objects, it's annoying.
The if statement gave me a headache lol, the Whiskey isn't helping though.
If (expression)
B = parseint(e), a = e.something || -1 * a, b = some ? Fuckingweird : ternaryshit;
So assign multiple variables with comma OR do expression, expression?
Learn something new every day with js.
to do things with node you google "npm thing" in this case you want passport. npm passport.
just restarted the browser and it works!! Thanks for the help user.
I don't know if this is the work of a minifier or someone actually wrote that convoluted code.
I was just surprised it even compiled.
Turns out that the comma (,) is actually an operator not just used for separation.
Var a = (1, 2)
A is one and then two because it executes all the expressions then returns the result of the last expression.
Javascript rockstar wizards, how do I implement a toggle effect in basic JS? I'm stuck.
>5 imports is a lot, 20 is retarded
What should I use instead?
The issue was actually that the import had an id that was the same as a div in another import, so getElementById was fetching the wrong element. Order did matter, but only because it meant getElementById would see the import before the div.
... Are you guys testing any of this code?
>Promise.resolve().then(y = 5);
That's not how you do callbacks. The y=5 part will be run immediately, and then 5 will get passed as the callback to that promise and ignored.
>Promise.resolve().then(() => { y = 5; });
I'm charging $2500 for something similar, and I'm doing him a favor because he's a friend of a friend. Nigga, what are you doing?
Don't know if it is related but after i tried configuring MongoDB as a Windows Service mongod doesn't work at all.
Tried reinstalling a few times, didn't help,
After clicking mongod.exe it shows a window with a line that it is trying to connect to port :27017 and after brief moment mongod window exits.
Does anyone have an idea why I can't keep mongod open?
Pick related.
Exact Promise syntax is unrelated to the question being asked. All you need to understand is that y = 5 after an asynchronous call, which ".then(y = 5)" clearly means if you're capable of abstract thinking.
need help but Sup Forums thinks my post is spam and I've no idea why so dropped my question on pastebin instead pastebin.com
You keep a database of users.
You have a route for a template profile. (ex: "/profiles/:user")
Client asks for the template with a specific user. (ex: site.com/profiles/alice)
Server serves template and perhaps a JSON object containing user information, which it pulled from its database.
Client fills template with user information and displays template.
nevermind it was image0.jpg fixed it
>pastebin.com
use console.log() before/after the lines you think are causing problems. Print the relevant data.
Where i can learn how to create Magento 2 extentions quickly?
What are some good arguments for using PHP in a completely new project without any existing code base?
lot's of resources on how to online
It depends on the requirements of the project.
Shit. I just bought 2 React udemy courses yesterday.
what software did you guys use for programming ?
what do you mean exactly?
Editors, Frameworks, Tools?