/wdg/ - Web Development General

>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 (independent of your browser choice)
freecodecamp.com
codecademy.com
hackr.io

>Further resources
developer.mozilla.org/en-US/docs/Web - excellent documentation for HTML, CSS & JS
github.com/kamranahmedse/developer-roadmap - Frontend+Backend learner-path suggestions
youtu.be/Zftx68K-1D4 - Web Development in 2018

jsfiddle.net - Use this and post a link, if you need help with your HTML/CSS/JS

Attached: wdg.png (1280x720, 180K)

Other urls found in this thread:

discord.gg/wdg
jsfiddle.net/vjp0rg1L/5/
w3schools.com/howto/howto_css_image_overlay.asp
jsfiddle.net/bq1kp77x/
youtube.com/watch?v=jHKQUGsn7zU
github.com/sparksuite/simplemde-markdown-editor/blob/master/src/js/simplemde.js#L1280
twitter.com/NSFWRedditGif

First for Riot.js

First for Ruby

First for HTML xd

First for I hope you accomplish your goals this year

Thanks, m8, you too.

Is a portfolio site made with WordPress a bad look?

If anyone is interested (from ), I found react-simplemde-editor and it seems to work fine so far.

Yes, even if you built the whole theme yourself.

W3school
Stackoverflow

Bucky roberts youtube tutorials for new dummies

first for how do i steal a webpage that uses js to pull info from a public api on another website

Python html scrape
Than crate a template to hold the info

jamal give it back

Should react states be in the constructor or not?

Was unsure whether to ask but fuck it. I downloaded something from the appstore the other day on a whim (learning game, teaching javascript) and had some fun with it, now I have my heart set on actually learning the language but I'm not exactly tech savvy (never used photoshop or an image editor, never even used amazon/ebay, basically just use internet for youtube/games).

Do I need to familiarise myself with basic web tools, then learn HTML, CSS before going into Javascript? Is JS the easiest language to learn?

If anyone's interested:

discord.gg/wdg

@app.route('/')
def index():
pass
@app.route('/process', methods=["POST"])
def process():
pass

@app.route('/reset', methods=["POST"])
def reset():
pass


why using thing like Flask, Bottle, etc to make web pages instead of writing HTML, JS, CSS directly?

>define "fluid structure"
in relational databases each relation (table) has predefined attributes (columns)
in mongodb you can have different, arbitrary fields in each document

>also in what situation would you actually have non-relational data?
look at amazon product details
for a bluray:
>Format: Blu-ray
>Language: German (DTS HD 2.0 Stereo), English (DTS-HD 5.1)
>Subtitles: German
etc.
for a book:
>Paperback: 397 pages
>Publisher: Routledge; 1 edition (March 30, 1995)
>Language: English
>ISBN-10: 041512185X
>ISBN-13: 978-0415121859

-app/ (main module)
--components/
--model/
--stores/
--data/
--SomeBusinessLogicFile1.ts
--SomeBusinessLogicFile2.ts
-module1/
--components/
--model/
--stores/
-module2/
--components/
--model/
--stores/
-util/
-vendor/
-res/

I'm pretty sure a lot of porn sites have switched but I can't check since I haven't been watching porn for a couple months

how would you implement submitting and storing a post on the server using "HTML, JS, CSS directly"?

If you're using middleware in express/node.js, is it guaranteed to be applied in the order that you added it, e.g.

app.use(myMiddleware)
app.use(myMiddleware2)
...
...
app.use(myRoutingModule);

>how would you implement submitting and storing a post on the server using "HTML, JS, CSS directly"?

making a HTTP request in JS and parse the response?

yes, a request to your web service that perhaps uses Flask or Bottle
so you know after all

Any fairly recent (16+ and up) tutorial about a simple CRUD react app with a list, detail, edit and new components?

honestly?
if you got a lot of enerrgy pushing you to learn JS, go with the cosmic flow, you'll charge through it.
But webdev? all things being starting point equal:
html
css
then js
other stuff after that.
js is pretty easy to learn, it's probably the easiest C legacy to learn, mostly because it's accessible to newbies, easy to drop the code in your site and start with simple tasks. immediate gratification-type thing.

>Do I need to familiarise myself with basic web tools, then learn HTML, CSS before going into Javascript?
You'll need all of html, css and js to do any web stuff beyond static pages (well, css can fake dynamic pages but it's complicated and not worth it).

You should start by installing Gentoo though.

Alright, I am to stupid to figure this out on my own. I must be missing something fatal.

I got this grid layout. can you add a text on hover effect on top of the images without breaking the grid sructure?

All help appreciated
jsfiddle.net/vjp0rg1L/5/

Oh wow, I forgot to mention the background color of the text-box overlay should fill out the square and I need to position that text on the bottom. you know. usual stuff.

add a event listener on hover ?

okay sure, i am obvioulsy not that far into things but I can see how that may work out. I'd prefer an non js solution. Specifically, I am puzzled at why I cannot just set the caption to 100% width and height and it would fill out the fraction set by the grid.

position:absolute

>using anything but mdn
why torture yourself bros

tried all variations with position already.
Can you update the fiddle with it working?
I am beginning to suspect I need to change the grid structure.

Cheapest VPS?

vultr

I can't tell what you're trying to accomplish with all the image links broken. I assume by "text-overlay" you're referring to the figcaption.

exactly. Dont mind the broken images. The grid is on point and the distribution looks as it needs to. The width and height need to scale fluidly based on the fractions. All in all the structure is done.

I just need to add a image hover effect like this: w3schools.com/howto/howto_css_image_overlay.asp

Right, thanks mate. Will strike while the irons hot in regards to JS, then go back to HTML. Haven't had this giddy feeling saying "fuck it" and dedicating to learning something in years

Not going to lie, no idea what Gentoo is, I'll look into after though, thanks.

ovh

jsfiddle.net/bq1kp77x/

So I made the elements position:relative so that each absolutely positioned child (each figcaption) uses its parent as its positioned ancestor.

Then I gave figcaption 100% width/height to make it fully cover the image (since they should both fully fill ).

I wasn't clear on where h2 was supposed to be, so I removed the margins and put it on the bottom of figcaption using absolute positioning.

Hope this helps.

How do I come up with ideas for a website?

Scaleway

I like gigs and atlantic

look at freelancer and startup sites and try to read between the lines to see what their grand idea is and whether they're pure business or 'creative' types with no technical ability. If they are, then their idea is one they can't make and are looking to hire someone like you to do.

So make it and beat them to market.

>Scaleway
They look fully featured for a budget VPS, any catches?

more expensive than

what's the state of back-end applications? Are they unoptimized pajeet software asking for redesign or would I actually have to come up with new ideas to break in?

at any worthwhile company, they're already really fucking anal
but otherwise plenty of room for improvement

I have a small website written in node/express/moustache/mysql.
I'm trying to make it as bandwidth and CPU efficient as possible, so I'm thinking of moving to another, statically and strongly typed compiled language. Thing is I also want to keep node's asynchronous model since it scales really well.

Yay or nay? What do you recommend?

vert.x seems pretty decent, it's been mentioned on Jow Forums a fair bit.

Looks good, thanks.

Is typescript worth learning for the sole sake of Angular 2 and up?

Attached: anri sugihara.jpg (440x600, 46K)

>try to google literally any javascript thing
>first 10 google results are jquery stackoverflow questions

Filter out JQuery in your search.
>Quality of life instantly improved.

For making an app for both Android and iPhone, is it best to use something that can cross platform, or Dev both specifically using different stacks?

ovh is at $3.35/month (1 year) $4.47 (1 month) for 2GB ram
vultr is at $10

it's worth learning for the sole sake of anything

react native will probably do fine

Nativescript is pretty nice too since you can use Angular 5, typescript, and javascript all

if you're doing it alone
good fucking luck

oh okay, there's a 512mb option on vultr, I'm blind

you're googling the wrong questions mate

Attached: 1460489579280.jpg (237x258, 17K)

Flutter and React Native are your best options right now for cross platform.

Is this the correct way to make routes on a child component in react?


//Parent




//ChildOne

//match.url = child-one




The official documentation is so confusing

just use jQuery

Do you even know what jquery is?

Hey guys check out my sick hacking tutorial series. No need to thank me.
youtube.com/watch?v=jHKQUGsn7zU

Trolling is a art

>Is this the correct way to make routes on a child component in react?
React-router v4?
It looks about right to me.

Has anyone here applied for a position with Crossover?

I just finished the application process, it's pretty intense.

Can someone give me a quick rundown on django? I'm currently learning python with django and was wondering if I have to do the design as well as programming? What is a good tutorial for django? Please help.

Can anyone explain what's going on in here?

const UserLayoutRoute = ({component: Component, ...rest}) => {
return (


(



)} />


)
};

Simple (react) question:

Why don't I ever see applications with test when I browse github?

I thought testing was common and important.

I can't even find good applications that include testing

>searching what software related jobs are posted
>using "javascript", "java script", "jquery", "node", and "ecma2015" as search queries returns unique job postings for each

probably using different frameworks in the search would return more unique results
combing through postings seriously looks like it'd be a pain to catch all the ones that pertain to you

testing is a thing everyone shills for but no one actually does

I sure hope so. Testing is so fucking boring, TDD is one the biggest memes out there.

Hey, I'm new to web development, and have no idea how to run a project that is on github, do I just download all the files and run them? I'm trying to run a python project, but can't seem to get it up, what do?

>Is JS the easiest language to learn
lmao

using the render property is much more flexible, but it looks like its working out for you meight

How do I get into the styling part of the whole webdev thing?

I can build a backend with Node, Go or Java just fine. I'm already somewhat familiar with React or Vue as frontend libraries but everything I do always looks like a clusterfucked piece of shit (although it works). I just don't seem to get a hang of bootstrap or bulma or whatever. Why is it so fucking disgusting to style anything properly.

hire someone you jew

UserLayoutRoute is a regular React component that kind of looks like a Higher Order Component (i.e. takes in a component as a parameter, passes in the component's props, and attaches any additional props).

(or ) allows you to render multiple components on the root level of your component while not having to add a wrapper div like you'd usually do. When it gets rendered to the DOM, you won't see the tags.

is a react component that you import from a local file or library

is likely an import from react router. The render prop on it allows you to render something as long as the route path matches. The "path" property is assumed to be passed by whatever component the is set to

What do you lads think about AdonisJS?

Made a thread a while ago but the only reply I got was some autist bashing Node.

I was wrong, can't use it without forking simple-mde and fixing this shitty line, because why let the developer decide if they should load fonts from some random CDN that I already have but are not in a stylesheet from maxcdn.
github.com/sparksuite/simplemde-markdown-editor/blob/master/src/js/simplemde.js#L1280

I've got a weird problem with Express/Passport.

var isAuthenticated = function(req,res,next){
process.nextTick(function () {
if(req.isAuthenticated()) {
console.log("Authenticated.");
return next();
} else {
console.log("Not authenticated.");
return res.status(401).json({ error: 'User not authenticated' });
}
});
}
router.route('/login').
get(isAuthenticated, function(req, res){
console.log('user: ', req.user);
console.log('session: ', req.session);
res.status(200).json({
status: 'Logged in.', user: req.user
});
})


isAuthenticated will write "Not authenticated" to the server console.
However, if I take it out, then the /login GET will find the user and session happily.

Any ideas?

I think you need to use that function as middleware

>trying to make a simple tv show tracking thing on either electron or nw.js
>shit loads of compile error when trying to include sqlite with either electron or nw.js
>read up and it actually requires a shit load of dependencies and specific versions of npm and python

How do js based developer work with what they have? This is a fucking nightmare to figure out

>How do js based developer work with what they have? This is a fucking nightmare to figure out
Welcome to modern JS. Everything is version dependent because so much changes so quickly and all the tutorials and forum posts are out of date and no longer work.

Using the API correctly?

Attached: file.png (854x571, 56K)

>I think you need to use that function as middleware

It is, isn't it?
It's a little hard to read because I lost the formatting but:
>router.route('/login').get(isAuthenticated, function(req, res){
That makes it middleware, right?

That all gets done in the /login POST function, which seems to work correctly.

Why though?

Attached: 1458660324723.jpg (164x216, 6K)

It's just all changing so quickly and people aren't worrying much about backward compatibility, mostly because they fucked things up the first time around.

There may be no "next" param in app router so you'd probably want to do something like this:

var router = express.Router()

// middleware that is specific to this router
router.use(isAuthenticated);

router.get('/login', function(req, res) {
console.log("Authenticated!");
});
router

Attached: file.png (1007x878, 215K)

Otherwise you could probably do the following: You can pass an array of middleware in the middle param before reaching the third parameter. As long as they all call "next()" you'll get to the third param.

router.get('/login', isAuthenticated, function(req, res) {
console.log('user', req.user);
});

C++ webdev yay or nay?

Attached: wt.png (98x74, 2K)

I'll give it a shot.

Nay

Eyy

ayy

user's first page

li {
text-align: left;
width: 600px;
}








is obsolete and css should be used instead
how to set text to be left aligned/justified and centered
with body { text-align: center; } ?

Apply text align to body ul li
or make a class and give li that class

For styling there's a few rules

1. Any rules that are more specific to the element that you're applying styles for will override.
Example:


body {
text-align: center;
}

div {
text-align: left;
}

Center aligned text

left aligned text.

Still left aligned text.


any text inside a will be left aligned instead of centered, even though it's in the body.


2. Styling with IDs override styling with classes

Example:


.button-primary {
background: blue;
}

#button-signup {
background: red;
}

Log in

Anyone here have any experience with Progressive Web Apps (PWAs)?
I have a couple of questions.

>Styling with IDs

Attached: 1520022393110.png (1106x1012, 573K)