/wdg/ - Web Development General

/wdg/ - Web Development General

Previous Thread: >Discord
discord.gg/wdg
OR
discord.gg/0qLTzz5potDFXfdT
(they're the same)

>IRC Channel
#Sup Forumswdg @ irc.rizon.net
Web client: rizon.net/chat

>Learning material
codecademy.com/
bento.io/
programming-motherfucker.com/
github.com/vhf/free-programming-books/blob/master/free-programming-books.md
theodinproject.com/
freecodecamp.com/
w3schools.com/
developer.mozilla.org/
codewars.com/

>Useful Youtube channels
derekbanas
thenewboston
learncodeacademy
funfunfunction
computerphile
codingrainbow

>Frontend development
github.com/dypsilon/frontend-dev-bookmarks

>Backend development
en.m.wikipedia.org/wiki/Comparison_of_web_application_frameworks
[Gist] backendDevelopmentBookmarks.md

>Useful tools
pastebin.com/q5nB1Npt/
libraries.io/ - Discover new open source libraries, modules and frameworks and keep track of ones you depend upon.
developer.mozilla.org/en-US/docs/Web - Guides for HTML, CSS, JS, Web APIs & more.
programmableweb.com/ - List of public APIs

>NEET guide to web dev employment
pastebin.com/4YeJAUbT/

>How to get started
pastebin.com/pDT82mQS

>cheap vps hosting in most western locations
lowendbox.com
digitalocean.com/
linode.com/
heroku.com/
leaseweb.com

Other urls found in this thread:

php.net/manual/en/features.persistent-connections.php
php.net/manual/en/pdo.connections.php
jsfiddle.net/3zj5je8w/
theregister.co.uk/2016/11/30/investigatory_powers_act_backdoors/
jsfiddle.net/yh7x7nk1/
collinoswalt.com/feed/
jsfiddle.net/hhxLhxha/
jsfiddle.net/hhxLhxha/1/
pastebin.com/hmJNaQV6
twitter.com/AnonBabble

I recommend trying out Vue.js
I've used it in a couple of projects now and it's easy to get into, yet powerful and lightweight.

What is its purpose, how does it work, and what is it?

With PHP/SQL, opening a page connects php script to mysql, does what it does then quits the connection.

Is this desired behaviour?

just another meme js library

Yes it is.

What are you trying to accomplish?

Was just wondering if frequent opening and closing of the connection can be avoided.

Don't worry about it, the process has been thoroughly optimized.

Still, you can actually keep a connection open, but unless you have a reason to do so (other than performance) you're probably better off sticking to default behavior.

php.net/manual/en/features.persistent-connections.php

It's a frontend framework, like angular, react, etc.

Are you using PDO? (and using it properly?)
php.net/manual/en/pdo.connections.php

You can reuse the same connection over the lifetime of the script by using the same PDO instance, which speeds things up if you need to hit the db multiple times in a script. Some languages can make use of a persistant connection pool, but it's not really much better to do it that way in PHP because of the way it works.

I've uploaded my first HTML to my web host through FileZilla to the public_html folder. However I have no idea how to set it up so that the file is what shows up when I go to my site. Where do I need to put it?

Yeah it's the same PDO instance. I'll rtfm and see what works how.

The server looks for index.(html/php/else).

If you aren't running a scripting language in the background (PHP, for example) just make sure your server is configured to serve static html pages and request them with:

webserverurl/htmlfile.html

is vue.js really nice though or is it just whats hot right now? I thought react had next - what happened? wave hopping js frameworks? we dont do that in harlem

OP forgot to mention hyper.io as a cheap hosting alternative.

react is a bigger ecosystem with more custom renderers

vue is like lightweight react easier to get into but still uses a virtual DOM and provides reactive and composable view components

Do I really need to install a database server and scripting language on my computer and deploy stuff from there to my web host? Can't I just manipulate databases and write scripts and stuff on my web host account?

reproducible environments are a major key

return preg_match('/set/', $this->conf->queries[$queryname]) == 0 // not a "set" query
?
$query->fetchAll(PDO::FETCH_ASSOC)
:'Done.';


When the query name contains "set", meaning it's an input/update query that doesn't need to be fetched, the function should avoid fetching.

Yet it doesn't avoid fetching. Why is that so?

Does PDO fetch method run independent of control flow?

Trying to add an image to my site. I've uploaded it to the public_html folder but have no idea how to specify it in the html code. Thought it would be public_html/image.jpg but this doesn't work

PHP Fatal error: Uncaught exception 'PDOException' with message 'SQLSTATE[HY000]: General error' in *.php:15\nStack trace:\n#0 *.php(15): PDOStatement->fetchAll(2)\n#1

Try just 'image.jpg'. The server reads locations in reference to current script location.

public_html is just the name of your base working directory.

If you're having some performance problems, that probably isn't the bottleneck unless you're just doing a gargantuan amount of queries, and if that's the case you just need to refactor some stuff.

Personally I haven't used it much, but from what I've seen it actually is pretty comfy. One thing most people seem to like about it is that it just werks without some huge toolchain unlike react.

Cowboy coding aka developing and testing on a production server is usually a recipe for disaster. You technically can do it, but if you fuck something up and manage to crash or 100% a shared server, your hosting provider will get pissed.

Has anyone here tried mobx?

I don't really understand it. It seems like magic.How does it know whether to call your computed properties / autorun functions?

After all, you never specify the properties that are observed, you just use them and it seems to know when to actually call the function.

It obviously can't find out what observed values are required because then the autorun functions would cause their side effects, but there's not really any reflection in JS for this kind of stuff, is there?

I want to learn a JS framework, but I just don't know which. React + Redux is a nightmare, React + MobX is Magic, Polymer becomes 2 way databinding madness way too quickly and Angular 2 is huge and slow.
And nobody seem to use Vue with Vuex, so I don't know about that.

Not having problems just wonder if a persistent connection is better.

How do I stack two images on top of each other and center the smaller one in the center of the bigger one?

Do you know which image is the smaller one?

hmm

print ''. $queryname . ' is a set query: ' . print_r(preg_match('/set/', $this->conf->queries[$queryname]), true) . '';


results in

getIdentity is a set query: 0
setIdentity is a set query: 0


Guess I need to hone my regexp skills.

testing it, though:

$queries = ['setIdentity', 'getIdentity'];

foreach ($queries as $queryname)
{
print ''.$queryname.' is a set query: ' . print_r(preg_match('/set/', $queryname), true) . '';
}


results in

setIdentity is a set query: 1
getIdentity is a set query: 0

Yes I know the exact size of both of the images.

are you QUERYING my gender IDENTITY
TRIGGERED

I ain't querying shit right now as you can see.

For some reason the exact same thing results in two different results.

There must be a typo or something in there.

GOOD GOD am I an idiot. The first example checks "set" against the array value of $queries[$queryname] and not the actual query name.

Never mind I did it

so don't fetch anything.

I'm not anymore lel.

Stupid question but
WHY THE HECK doesn't anything work exactly like .
align: center;
align-text: center;
align-items: center;
margin: 0 auto;
width: XXXpx;

STILL NO CENTERING WTF

post your fiddle and we'll take a look.

#something
{
display:block;
margin:0 auto;
}

Well there are things that work even better like Flexbox and Grid, but thanks to the IEturds those features are literally never ever going to be usable.

you probably have CSS somewhere else that's messing things up

jsfiddle.net/3zj5je8w/

if by all those IEturds you mean 10% of browser users, sure.

you don't really need to use flexbox or grid anyway for something as simple as centering stuff.

The alternatives are usually pretty shitty. Display: table and display:table-cell fuck up a ton of other things and so do position:absolute and transforms.

What about NearlyFreeSpeech, is it a good idea to use this for a portfolio and blog website?

position:absolute and transforming for centering something would be dumb as hell.

margin and text-align is all you need most of the time.

Just got done developing my final project after having minimal web experience.
Used Java, play framework, ebeans, mysql, and bootstrap.
Crazy times, and documentation for play is ass. Absolutely garbage. But at least I know how to make a knock off Sup Forums site with logins.

Yes, when centering horizontally, that is enough.
But then there's vertical centering of elements whose height you don't know.

i don't see why not, tons of hosting out there....just make sure it supports whatever technologies you're going to use. nobody is going to care about your hosting service when they're looking at your app.

Thank you, sir/madam/misc.

Any UK-based web hosts that don't suck?

Nope.

theregister.co.uk/2016/11/30/investigatory_powers_act_backdoors/

display: table and display: table-cell won't mess with other stuff if you parent/child your elements correctly. All it does is pretend your divs are table and td elements.

jsfiddle.net/yh7x7nk1/

this shouldn't mess with anything else on your web page, unless you give it the same class of course.

I'm building a fullstack application, where a React frontend interacts with an Express API server. I want to test cross-origin requests (e.g. the react client hits an express post route which will fetch api data from some remote api somewhere).

However, you can't do that with the file protocol that localhost serves content with. How do I get this stuff running on http? Will I just have to upload to a hosting service like Heroku and incrementally test it like that? Seems like a major pain in the ass.

forget to add in a row... throw in another div and display: table-row it, then the div you are going to display: table-cell would go inside that

Post some code. You should be able to do http requests just fine on localhost.

Chrome throws this error if I try to contact my locally hosted Express server from the React client it serves up.
bundle.js:28243 XMLHttpRequest cannot load localhost:3000/yelpFetch/yes. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

I'm trying to build an RSS feed for my site using php. Can anyone tell me why no rss reader is showing anything with my feed?

collinoswalt.com/feed/

in PHP I have header('Content-Type: text/xml; charset=utf-8');

As far as your browser is concerned, it shouldn't be a cross-origin request if you're proxying it through your express server.

I made a simpler example... if you apply and "imitate" your divs like a table, you have more control over them like vertical alignment, etc. The tricky part is nesting your divs correctly, but if you know tables there shouldn't be any problems.

jsfiddle.net/hhxLhxha/

I was sending the AJAX request to 'localhost:3000/thepostroute' rather than just '/thepostroute'.

wew lad

thanks for making me walk through it again

ok last one I promise. CSS is funz.

jsfiddle.net/hhxLhxha/1/

other than job opportunities, what are the advantages of PHP over node.js?

Well, like Perl, pretty much every shitass dirt cheap shared server has PHP support. If you want to run a node app, you need a VPS can be a bit more expensive and involved to set up.

Should I consider using free hosting from hostinger.co.uk or onesite.co?

if i add a confirm pop up window in js after i submit a form that runs some php, the php code will be stopped UNTIL the user selected "ok", right? Or does it run anyway? i'm trying to make sure the user really wants to delete a row in a table....

My shitty little site has a problem.

Everything looks really good on my monitor. But whenever i connect to the site with a different resolution everything breaks.

i've got an image and a video player that i want to make a certain percent of the screen. But i've tried shit that i've found online like "width: 80%" but it doesnt really work.

Could someone tell me what i'm doing wrong?

etc.
I have a background image thats stretched. an image that's centered, and a video player in the middle of that image.

No, PHP execution happens on the server, not the client. It happens as soon as the server receives the request. If you want to ask the user to confirm, you need to do it before you send the http request.

Post screenshots and css

This is what the page looks like right now in super stretched portait. I'm designing it for 16:9 but shit is outside the screen so i took the picture in portrait.

I want the gray box to be in the middle of the screen and be the backdrop for the video and the button.

it's more or less the first site i've made so pls dont laugh at my shitty code.


pastebin.com/hmJNaQV6

What's a good and fun project to build when you're just starting out?

You should make js ask the user onsubmit, then if they select no return false. Stops the form submitting. Otherwise returm true and it goes ahead.

just bootstrap it or something, i haven't even looked at your code but im guessing its shit m8

thats what i was thinking but since js is client how would it stop the server side php? i think is right

>how would it stop the server side php?

It doesn't. You send the HTTP request only when the user confirms.

the more i practice and study the more i realize how far behind i am
it feels like an endless chase to catch up in web dev

that sounds like to me the php would go inside the js condition that decides if the user confirms or not. But with php i do a condition first to see if the submitButton in the form is set. So i'm still confused.

Just two things I quickly noticed:
• Avoid using inline style sheets ( tags, rather place this in its own file). It promotes reusability of the same styling throughout other pages.

• The background attribute is not supported in HTML5. Use CSS instead.

Same and I feel that way already just for web design.

>make form
>have a button (anchor will work) with onclick="somejs()" that doesn't send the request
>have somejs function that prompts for confirmation
>when confirmed, submit the form

function ask()
{

if(prompt('wanna send the request?'))
{
document.querySelector('#myForm').submit();
}

}

Send


or just


Send

not sure either will work out of the box, haven't done this in a while

Also the tags aren't supported on HTML5 either. You can achieve the same effect by using the margin: auto, margin: 0 auto properties (if the position isn't set to absolute)

>tfw have 700+ screenshots of various websites in my inspiration folder
>tfw chop shit I like and photoshop everything in to see how it would look like
>part of the photoshop file is a screenshot of already coded website, and other parts are just layers with various designs from other sources

I swear to god I have the weirdest fucking web design process.

>inb4
I design before I code, but when I decide to switch things I'm stuck with the already coded thing. It's not that bad because making tweaks is easy.

You can change the to and instead hook the form on submit event

I'm having some problems with my FF newtab page and autofocus features.

Right now, whenever I open up a new tab with "NewTabOverride" addon, it opens my startpage correctly, however I find that my address bar has focus instead of my search bar. If I refresh the page, it autofocuses correctly after it loads.

I cannot for the life of me figure this out. What did I miss /wdg/?

I did something similar for my last website. It turned out very well. Good luck!

do you know exactly what you wanna do?

>web dev
>web design

These terms are really vague. Do you want to do web graphics? front end dev? back end dev? all of it? web dev is chopped up into 3 parts in my opinion.

>graphics, user experience, look/feel (photoshop, illustrator, wireframes)
>front end development (html/css/js)
>back end development (sql/php/node/asp.net)

I'm a big believer in starting with data. Know how to CRUD. Know how to work with data. Have data to use. Either find it or create it. Know what your app is going to do. Plan out the functionality. Then work on the visuals and experience. If you have the "blank screen" problem you're trying to cross the bridge too soon, my friend.

yes i want to do web apps, esp SPAs
full stack

i have made a ton of them and can do alot of cool work but i still feel far behind

Why does everyone keep saying web apps?

Wew

Okay first of all, get rid of the tags and align=center attributes. All that shit is depreciated, you're supposed to do it in css now. And it's bad practice to use style attributes, especially when you already have an inline stylesheet on the page. Keep things organized and DRY. Usually you'd want to put the css in its own file anyway.

Now that that's out of the way, if you want the player inside the gray box div, you need to, ...you know, put it inside the div. Not under it.
So, roughly speaking, this is what your code should look like:

. . .

#playerContainer {
background: /* read the docs for this css property. set the background image here instead of in an tag and use a color as a fallback */
/* this is also where you position the playerContainer div on the screen. Use the margin property if you want it to be responsive */
}
#player {
/* player positioning code goes here */
}

. . .




// player code, etc

Because it's shorter than saying 'web applications'?

...

You sound further than i thought. If you can CRUD and you're building SPA's already, look into the latest front end frameworks like React or something. Are you employed? What do you mean when you say you still feel far behind? If this is a situation where you feel this way because you're using older technologies, then I think you're stressing too much. I know programmers still using Pearl, Cobol, etc. They exist. It's not a big deal if you want to use something newer, in fact it's probably a good thing. However if you mean you're not at the level to be employed and have a career, then I would recommend diving into data first like I said in my previous post. Big data especially.

bumping for help?

neet.
i'm far behind because i dont know techs like react/angular/python, or even basic algorithms. i am technically employable because i can do work but i feel like im far behind the average junior level employee. maybe your data approach is a good idea.

yes i can crud and build api's from scratch

what are you using to build your SPA's now? can you fizz buzz? if you're technically employable then i don't see a reason why you're not learning on the job. Could be a disaster, could go great. I was let go from a previous job because I didn't know ASP.NET CORE and I honestly did not want to learn it. New job is going great. Average junior level web dev is around your level, i'd say. Junior software engineer...now that's a different story.

js/node/mysql...i do everything in js including any animations

>asp.net
like 7/10 jobs require that around here, it's horrifying

yeah they actually forced all the programmers there to start using it. There was only 3 of us, but the fact that i've never used asp.net anything, the CORE stuff was over my head and I already hate M$. Plus the commute was terrible.

Working fine for me m8

In the market for a new laptop.
So what laptop do you guys use?

...