/wdg/ - Web Development General

>Previous thread
>Free resources to get started
Get a good understanding of HTML, CSS and JavaScript.
developer.mozilla.org/en-US/docs/Learn - a good introduction (independent of your browser choice)
developer.mozilla.org/en-US/docs/Web - General documentation for HTML, CSS & JavaScript
freecodecamp.com/
codecademy.com/
bento.io/

>Further resources
github.com/iRaul/awesome-portfolios - Portfolio examples
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

Other urls found in this thread:

jsfiddle.net/kda2rdLy/
github.com/eligrey/FileSaver.js/issues/55
w3.org/TR/html5/tabular-data.html#the-table-element
github.com/hongru/canvas2image/blob/master/canvas2image.js
en.wikipedia.org/wiki/List_of_file_signatures
jsfiddle.net/d7jdnvgd/1/
egghead.io/lessons/react-redux-the-single-immutable-state-tree
learnxinyminutes.com/docs/java/
openresty.org/en/
twitter.com/NSFWRedditImage

First for HTML

Can someone explain react-redux to me? Why does it require the Provider wrapper and why does it pass the store via context?

would it be bad if I stored the redux store in an global variable and used it without react-redux?

CSS Grids, worth to learn over some front-end framework?

Why doesn't wdg like angular? Been using it for a couple of projects and it's pretty good

Can anyone using safari test this fiddle?

jsfiddle.net/kda2rdLy/

IT works on safari 11+ but not safari 10.0.3, for example.

Why is this simple feature, simply broken in Safari?

github.com/eligrey/FileSaver.js/issues/55

>simply broken in Safari?
yeah it works on 11. Also, many things are broken in safari.

the banking website I use recently did UI update, and its broken on safari. Literally have to switch my browser to chrome to use modern sites since Apple is shipping shit lately...

IMO Angularjs(1.x) was good but angular 2+ kinda ruined it, they increased the complexity and the version upgrades 2->4/5 make it so that the learning material always needs to be updated so it';s hard to find good up to date learning materials.

I have to learn Java first and then I can lern android development, or I can start learning android develompent and there I will learn Java?

You should ideally understand basic java first atleast understanding the basic syntax, should take like 3 hrs to pick up if you already know how to code otherwise like 2 weeks - 2 months depending on how slow you pick up new material.

Alternatively, you could learn JS and pick up react native or ionic.

do I need power to turn on my PC or i can I turn it on and get the power later?

Second for CSS

This. 2+ tried to be react and did it badly.

I understand the basics, a few years ago I made a Java course for a while but then I quit.

I thought that If I want to start a begginers course of android development they will teach me from scratch all I need to know about Java.

Post what you're working on

Angular is much more than react. Its more complex because it gives many more options and tools.

Most courses will assume some basic java knowledge, just watch a Derek bans yt java tutorial and then read The Big Nerd Ranch's android book or do the Udacity course by google.

get a small project I don't know a basic tally counter, and start searching on how to do it.

learning the manifest.json to better support mobile interfaces.

Is there future in webasm?

That's the issue, I don't need all those options and tools right off the bat. I picked up basic react in a day and then I can add on redux or flux if I need state management, react router is also easy to use and pick up. React is also easier to use than angular overall imo, you can use it just on a single page and use vuejs or other things at the same time without major headaches. Angular forces you to follow it's philosophy and is overly engineered for my uses. I usually go with vuejs or react.

>Javascript

cool, thanks pal

>learning the manifest.json to better support mobile interfaces.
my man
progressive web apps will soon take over the world and force mobilefags to learn javascript

So, imagine i have two JS canvas A and B.

In canvas A i draw a non deterministic finite automaton (NFA).
When i switch to the canvas B it generates automatically a deterministic finite automaton (DFA).

Now, here's the problem:

i can drag the elements individually to rearrange the elements if i want it to in both canvas.

but when i switch to canvas A and then to canvas B, the positions that i changed go back to normal (because it generates the the DFA based on the NFA in canvas A).

So, the positions of the automatons get saved in canvas A but not in canvas B.

How do i save the automaton's position after switching between canvas?

Why would a CSS grid take as long to learn as a front end framework? You don't really need to know what goes behind shit like Bootstrap or Semantic UI, you just need to know what their classes do and how to encapsulate rows/columns, which can be picked up by looking at their examples.

I like that Angular gives me every single tool I'd need to build enterprise level applications, for normal or small sites it is definitely overkill.

pretty good language, I know user.
PHP on the other hand...

I'm not a webdev but hell once I saw what can be done now in web I had to get in.

Im learning CSS
How the fuck am I supposed to remember all that shit Im learning?

important thing is to get a general idea of stuff that's possible to do and what to google in order to find the relevant documentation
you can also make or use someone else's cheatsheet
with experience you'll start remebering stuff that you use frequently

autocomplete while styling helps. Everyone forgets though, you'll spend more time googling what you need, you only need to know what CSS can and cannot do, and how to properly set styling rules without overriding shit somewhere else.

desu I forgot most of css, I just use a CSS framework and google when I need to use CSS myself

>How the fuck am I supposed to remember all that shit Im learning?
you don't do that.

1. learn how to google (use advance parameters, if google doesnt asks for captcha you are deep enough)
2. build a searchable knowledge base (keep is awesome at this)
3. learn how to grep and save examples
4. repetition legitimizes

Thank you guys, seriously.

Only actually refresh canvas B when canvas A's NFA is changed meaningfully (i.e. changes other than positioning). Or, when you edit the DFA, save offsets of each state somewhere, and then when you go to update canvas B, apply those offsets to the autogenerated DFA. You might have to invalidate or update the offsets if the NFA changes though, because things might not line up.

That's the best answer that I can give without knowing how you're doing things.

Silly Django question here.

I can't figure out why one of my urls.py is flipping shit because I haven't specified an app name even thought the exact same code works in another project.

urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'', include('main_site.urls', namespace='main_site')),
]

The error even explains the issue, I just can't figure out why I didn't need to specify an app name in my other project.

'Specifying a namespace in include() without providing an app_name '
django.core.exceptions.ImproperlyConfigured: Specifying a namespace in include() without providing an app_name is not supported. Set the app_name attribute in the included module, or pass a 2-tuple containing the list of patterns and app_name instead.

Any advice fellas?

>Want to come up with a good color scheme
>Site ends up looking like a fucking bag of M&M's

Why doesn't my table get styled when I'm using the following CSS?
table > tr:nth-child(even) {
background-color: rgb(128, 128, 128);
}

If I remove the 'greater than' sign, the table gets styled. My HTML does not contain any elements in between and .

check your html in the inspector, it's probably adding a tbody element

try "table > tbody > tr:nth-child(even)" or just don't use >

Oh yeah, thanks! Is this standard for web browsers, or is this a Firefox thing?

chrome does it too

Not that person but as far as I know it isn't forced in the standard to auto insert a tbody tag.
w3.org/TR/html5/tabular-data.html#the-table-element

Anyone have suggestions for a relative noob to monetize sites? I can get a wordpress up on a VPS. What are the best ads, affiliate stuff, or any other suggestions?

Also any free email service(other than Zoho) available using my domain?

I use yandex for free email which works great. Probably the Russian government reads my emails but thats cool w me.

Hi /wdg/, I'm doing some work which requires me to have a cloud-based project which accesses a database. I need a site which can host a MySQL server for free and accept requests on port 3307. It doesn't have to be big as it's just a demo. I've tried db4free.net but I'm having some compatibility issues. Most of the other sites I could find just by searching look incredibly dodgy, and Amazon requires a credit card to sign up. Could you give me a rec?

Few things.

Trying to find a way to convert raw image data into readable base64. Everything I try doesn't work. Canvas, filereader, btoa. Nothing.

Adsense is fine. Amazon affiliate is fine.

get a cheap VPS from Vultr.
The time you spend searching for some other suboptimal solution will literally cost you more, if you value your time at all in any way.

Should I learn a server side framework before JavaScript framework

Yeah but I have to hand off the credentials to some other people. It's only a demo and it's only going to be used a couple of times, so it's not worth paying for.

use aws free tiers or digital ocean with free credit from the bazillion podcasts they sponsor
you also get free stuff from github student pack

on this topic, do you have pointers on how to validate that an image's content maches its file extension ? like checking that user uploaded file laughingwhores.jpg is indeed a valid jpg pic and not something else renamed as jpg. is this even a useful thing to do on a site that would accept user uploaded pictures ?

this library has functions that could be useful to you

github.com/hongru/canvas2image/blob/master/canvas2image.js

if youre guaranteed no backwards compatibility, sure

What exactly do you mean by that? By raw image data do you mean like a bitmap of RGB values? And like base64 encoded JPEG or PNG?

>do you have pointers on how to validate that an image's content maches its file extension?
Not that guy, but pic related is a visualization of the bytestream of the jpeg file format. You basically just need to check the first few bytes of the file to see if the file signature is valid. Although in the case of jpeg, it might be in a JFIF format or an EXIF format. This is more comprehensive:
en.wikipedia.org/wiki/List_of_file_signatures

thanks, i'll try validating the file signatures

Vue noob here. For some reason this makes my browser freeze completely on load. What is happening?

var app = new Vue({
el: '#app',
data : {
var1 : '',
var2: ''.
var3: []
},
methods : {
addtoarray : function(){
this.var3.push([var1,var2]);
}
}
}
});

>var app = new Vue({
el: '#app',
data : {
var1 : '',
var2: '',
var3: []
},
methods : {
addtoarray : function(){
this.var3.push([this.var1,this.var2]);
}
}
}
});

This is more like it. I just had to rename and delete a bunch of variables so it isn't exactly the same.

one extra } in your code, but doesn't freeze or block when i try it

jsfiddle.net/d7jdnvgd/1/

>PHP on the other hand...
is great. Yeah, we all know already. No need to preach to the choir dude.

Fuck I'm so stupid I should have seen it. Thanks a lot dude.

I use AngularJS (1.x) on our company project, for which I'm the lead dood. It's great, but it has a relatively large amount of stuff to 'learn'. It's really easy to write a decent app in AngularJS, but it's also really easy to write a very bad app in AngularJS.

I've started learning Vue lately too, and it's a LOT easier to learn, which is either good or bad depending on your view.

Is Angular officially considered the pajeet framework yet?

it's the enterprise framework
and enterprise outsources to india

Any tutorials for working with Facebook SDK in android?

i already can create an account with the Facebook auth token not sure what to do next.

i want to get stuff like
>number of likes
>comments
>etc

it's the java of JS frameworks. lots of legacy angular 1.x out there and more to come thanks to dumb corporate cucks who choose to use the newer versions.

>tfw my job chose angular over react 2 months before I was hired

I've used both and greatly preferred react.

rtfm

Hear it from the man himself: egghead.io/lessons/react-redux-the-single-immutable-state-tree

Why does every single coorporate job ask for java?

I know ASM,C,C++,C#,LaTeX,HTML, CSS,PHP,JavaScript,Python AND THEY STILL DARE TO ASK ME TO KNOW JAVA WHAT THE FUCK IS GOING ON?

if you already know those languages it shouldn't take you long to pick it up

i know, just by knowing C++ i can wreck every single language on this planet but i still dont understand what the fuck is java so popular, C# can do everything it does and better

tell that to human resources that dont know/understand shit

Just say yes and read this on the way there
learnxinyminutes.com/docs/java/

You're done

It's portable, idiot-proof (garbage collecting) and the can enforce their inane bureaucratic policies with it.

Imo avoid java jobs.

i have been trying to avoid them for a year now, but they pay so fucking well and no matter what i do, they end up asking for java, i might aswell do to me it looks like C++ without memory management and with events included, plus it looks like shit

It's just C# without MS

So school is over, and I have about 2 months vacations. I'm planning on making some dank webapps.

What is the hip stack of the moment? Last time I did this used Mongo, Express and React.

How do you actually define if you know a language or not to decide if you want to put it on a resume? time? Number of projects? used it once and could deploy a single project?

Postgres, dropwizard + clojure, and vue

Just to clarify: java for dropwizard, clojure for complex logic

000webhost.com will fit the bill for MySQL databases

java or php for CRUD apps?

Java don't ever use php

Well that definitely sounds hip.

Are Free Code Camp and The Odin Project good resources for beginners? How do you guys like web dev? What don't you like?

Is web development/programming a good career path? I'm thinking of going into it but the last thing I coded in high school was a shitty HTML website in High School. Do you need high IQ math skills to be good? I wasn't bombing math in school but it definitely wasn't my strong suit.

It's a fun one.

Start with Elixir and Phoenix, it's easy to get into and seems to be the future for most RoR development projects.

> [Web] Development is exclusively for those with IQ of 140+, that's why we request a mandatory IQ test for all prospective hires - Mark Zuckerberg 2015

Wut

Post your most awful hacks.

that sounds like a stupid idea. putting everything in a single state object.

Right now I'm just putting states in redux which I want to autoupdate other parts of the application.

Before that, I was doing the same thing with event listeners, but its too tedious to set the evnet listeners up

>putting everything in a single state object
you mean a database?

what does dropwizard even do in that setup? You can write location handlers in clojure right into the nginx.conf if you wish. Or better yet, drop the jvm dependency and skip the abstractBeanCounters oo bs and pick a lightweight language like Lua. Oh wait, you can use that out of the box right now -> openresty.org/en/

wouldnt it be retarded to mirror your database into the frontend?

potentiall hackers would know the structure of your database from the frontend..

Also, my react components need to be reusable and working without relying too much on a main store.

oh god, I remember mandatory iq tests from my first job, the scrum master was so triggered because mine came back with a way higher score than hers she convinced the manager as an outlier I would be a liability to the team and should be released. Ever since I have a fear of female scrum masters

...is even better and not shit like Javascript.

>
>
good shit user

how does youtube view counter work?

I want to keep track of the most popular pages on my site, but can't just increment a counter on every page load, that is too ez to game

>I've already had an IQ test this year. I don't think i've ever had one of these.

Where do PHP pros store their classes, interfaces etc?

usually in .php files dude.

no but really check out psr-4.