/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
youtube.com/watch?v=Zftx68K-1D4&feature=youtu.be

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

Attached: 1531386156981[1].png (822x552, 868K)

Other urls found in this thread:

youtube.com/watch?v=pkdgVYehiTE
stackoverflow.com/questions/46198806/how-to-prevent-the-typing-of-special-characters-like-modifying-the-next-keyb/46202010#46202010
css-tricks.com/almanac/properties/t/text-overflow/
youtube.com/watch?v=7kVeCqQCxlk
adaptivepath.org/ideas/ajax-new-approach-web-applications/
developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
htmlhelp.com/reference/html40/entities/special.html
localhost
twitter.com/SFWRedditVideos

hi. i need to google the process. but i don't know the term to google.

i want the top of my webpage to stay static, never changing. then all the content flows with scrolls/navs, etc...

any help please?

Isn't that just a navbar?

well yeah, if i had nav pills to navigate to other places in the page.

but i am wondering if there's a way to do it without having those.

 = glyph

if I want to try back end development, should I need to learn HTML, CSS and Javascript. If I wanted the full-stack development route, will I end as a jack of all trades master of none?

position:fixed;

It's always useful to learn full stack before you start to specialize.

html, css, js are piss easy. it only gets retarded when you start using framework shit like angular/react

if on my page i want to link to something on another page that is half way down and the 3rd party does not have it already tagged to be linked to page positions, is there a way i can make it go there any way?

Saying Javascript is easy is like saying "pencils and paint are easy to use"

Reminder that Yii is the only php framework worth using

this video is recommend for beginner, very informative.

youtube.com/watch?v=pkdgVYehiTE

Alright guys, I am at my wits end. Over the past week I tried everything -- un/reinstalling every package, reconfiguring package.json, reinstalling eslint and tslint, ofc googling, messing with editor settings, starting the project on a different clean partition, etc....
My VSCode has stopped giving type hints for "browser "and "chrome".They just fucking disappeared, they are undefined. Everything else works still (like "node" etc.). Just the mort important envs for a fucking webdev are gone.

Is it because I can't find an "@types/browser" or something like that? Where could I download a fresh type defintion for browser and chrome?

Attached: 1464019214067.gif (800x800, 1.16M)

i want to get into python, is automate the boring stuff with python worth it? also, should i buy the course in udemy?

Maybe if you hate yourself.

```````````

>On my keyboard, whenever I write this shit, it does nothing until I press another key
That's probably your OS's keyboard configuration, what OS, keyboard and keyboard config are you using?

OS X, this key is supposed to be used to add accents on letters like "è"..

Is there a way to turn it off in OS X or using karabiner-elements?

not a mac fag so I have no idea, someone will though

mobx > redux

change my mind

no

well, I found this stackoverflow.com/questions/46198806/how-to-prevent-the-typing-of-special-characters-like-modifying-the-next-keyb/46202010#46202010

But don't want to create my own keyboard layout ffs (not using US keyboard).

Good luck writing unit tests around your store.

In Windows, keyboards behave this way (accents modifying the following character) if you set the keyboard type as something like "English (International)". It's a way to be able to type French on a QWERTY keyboard while still using English most of the time.

I just got used to it when I used to use that config but I eventually got out of the habit and just used "English (US)" all the time and used character map or the switch-keyboard-type hotkey when I needed to type French.

FWIW: `-space will probably give you a grave and I found that a pretty simple shortcut when I needed quotes or whatever.

How to cut long paragraphs of text down to a predefined number of words (and then something like ....) without breaking html tags in the text (like bold or spans with color classes etc) ?

So I have:
Lorem ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus modi eius reiciendis, illo atque omnis alias tenetur fugiat porro ut!

And I want:
Lorem ipsum dolor sit amet consectetur adipisicing elit...

css-tricks.com/almanac/properties/t/text-overflow/

Is there any reason why should I start using any PHP framework? I see a lot of Symfony mentioned in job offers, but I have never found myself any reason to use it.

>Client's site somehow managed to get a phishing script installed on it
>no backups
>all my fault
Welp we needed a new VPS host anyway

Attached: 1531585816714.jpg (1060x790, 512K)

Just use Laravel for big applications and Slim for REST APIs.

>not using version control
>not using a host that automatically backs up your shit

fucking idiot senpai.

How to get web dev job without cs degree

at my university its web development is a seperate course than CS (though i'm doing neither so i'm not sure of the overlap)

>be me
> know an okay amount
> knowledge of PHP and basics
>refresh basics from college (html, css, js)
>start to understand basic tools used e.g. gulp node, npm etc
>apply for junior dev job while still learning
>get job and learn while working

wasn't that difficult, once you're settled in you can start learning other stuff as well. Currently working with Angular at work but dabbling with React and Vue at home to keep my options open

If I use Bootstrap mostly for the responsive grid aspect, and I learn CSS Grid + Flexbox, do I need to use Bootstrap any more? Or is the Bootstrap Grid still a bit more advanced?

Why does css grid lose against flexbox even though grid is superior?
Source: youtube.com/watch?v=7kVeCqQCxlk
inb4 cross-browser compatibility

Can you get away without knowing gulp, node, npm to be front-end dev?

not him but npm is your package manager so no as front-end potentially uses more packages (depending on application)

Not much to learn desu, npm is just learning a couple of command lines

Node is just a way to run JS on anything, mostly servers, so not sure what you mean by this, express is a package for node that allows you to make a back end if thats what you mean

No harm in getting a basic understanding of it

Yes. It definitely helps knowing bunch of the latest and most fashionable tools/languages/etc., but it all depends on the employer.
Some might need someone who just knows how to make layout prototypes in HTML/CSS/JS, and some might need someone who knows how to extend their current front-end codebase with React modules, or smthlikethat.

Learning more stuff is never bad.

You're gonna shoot yourself in the foot if you don't, you'll be denying yourself about 60% of any starter job off the bat.

I got a job in webdev without knowing them but I knew the concepts of them and what they did, and that was enough to get it. My employer actually trained me on them after though, don't expect everyone to do that.

Can this be improved?
setInterval(()=>{for(a of document.querySelectorAll(".post>*>.quotelink")){a.classList.add("ql-tracked");a.text=a.text.replace(/\D*$/," (You)")}},9)

Bootstrap is using flexbox these days. Bottom line is both are easy to understand.

cs degree is essentially "i want to make games" and "im going to make the next search engine" it has nothing to do with IT or business in general and web is mostly business oriented. webdev is mostly inbound marketing you want a marketing degree if youre into web.

You're fucked
Change direction and do something that doesn't require training, skills and certification

Yeah but it's probably better to get ahead of it sooner rather than later. You'll have to learn it anyway and it won't take long. It's better to have something under your belt and say you can do it, plus probably 90% of jobs will ask if you know or have experience with them

Not really. In all honestly Bootstrap is there for backend devs or people with no real design experience to make a site that looks semi okay without much effort.

if you're just using it for Flexbox or a grid, stop bloating your projects with it

Has anyone used Canvas before? What's the point of it?

Bootstrap is there for those who can't design their own design system.
Those using it just for flexbox/grid are going to be in for a rude awakening upon switching out bootstrap for their own css grid/flexbox and recognizing how absolutely ugly everything looks.

pls respond

>>/dpt/

yes it is
dont spend any money on the trash that is udemy

>Why does css grid lose against flexbox even though grid is superior?
They don't have the same use case quite frankly so the comparison is silly. Someone not using both isn't using either to their fullest potential.

Best thing to make a web store?

I can make my own, but I want to put out a store really fast.

Shopify?

yeah
you can make it more readable for starters

to drain your users memory and eventually result in a segfault memory exception

Is there guideline for how much user information is worth to companies?

Say I had a website with 1,000,000 users, what medication they were on ect, I am wondering how much money that information would go for to various medical companies?

How to spot a pajeet

>PHP
>Bootstrap
>Node.js
>MongoDB
>Serverless
>Mobile first. Excessive use of white space with huge fonts and oversized colorful buttons aka modern flat/metro/material soiboy design.
>Fullscreen image/photo on the landing page
>JWT authentication
>Unironically saying 'code smell' and 'spaghetti code'
>20MB page size
>Meme top level domain (.io, .xyz, .gg)

Pretty sure violating HIPAA doesn't pay in th elong run

what's unreadable about it? the whitespace is irrelevant

What if I put in the T's and C's on signup that all info will be sold

Was for

Explain what's wrong with any of those things.

Maybe one or two of those indicate a pajeet, most are just shitty modern web trends.

Also "code smell" and "spaghetti code" have been around for many years, and I'm not sure I've ever heard pajeets use them.

I would say Wordpress is the biggest pajeet indicator, as well as even older PHP-based web software. Also pajeets are generally still using jquery.

ya blew it

any good Ajax resources?

Attached: 1517683761071.jpg (720x528, 45K)

I've just studied HTML5, CSS3, Javascript, jQuery Bootstrap and Wordpress. What hsould be my next step?
I have all my files well organized in folders so I can retrieve scripts from there any other steps I should be doing, where do I go from here? I need a web coding job but so far no luck jobhunting.
Btw I use Notepad ++ any neat plugins or addons for this shit?

Attached: 1531574254992[1].jpg (507x338, 87K)

next step is learning a backend language.
>notepad++
do yourself a favor and pick up vscode, or use the IDE for the backend language you pick up.

This is the original post that coined the term Ajax:
adaptivepath.org/ideas/ajax-new-approach-web-applications/

It's a pretty quick read that explains the broad strokes of what Ajax is and isn't.

Here's how to use the Fetch API, which has pretty much superseded XMLHttpRequest as the preferred client-side method of initiating an Ajax request:
developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Or did you want something more application-specific? Do you have something specific in mind that you want to accomplish with Ajax? Or did you just want to know what it is?

Make some things. A few side projects on your resume would be good. It would be great if you made something that people actually used, but it's not a necessity.

And I sort of agree with . You should learn a (real) backend language, or alternatively you could focus more on frontend and learn React or another framework.

should i pirate it then?

I've learned a bit of PHP and MySQL as well, I'm guessing I'm trying to build a searchbar result with ajax. I'm going to study web development in a few months I'm hoping to get a job from there, the school has a job exchange

php is a dead language pick up java or c# for free jobs

java or C# for backend?

You say that, yet I worked from entry level to a senior level php dev in 1.5 years.

c# probably easier and has better dev environment with visual studio. they are basically the same language so when you learn one the other will be easy to pick up.

thank you guys

I asked this before but the thread died and no one responded. I have a user input string I'm encoding/decoding using atob() and btoa() that is to be placed in the url.

Input: cr.mk>ex shoryuken
Encode gives: Y3IubWs+ZXggc2hvcnl1a2Vu
Decode gives: cr.mk^ÚÜ]ZÙ[

It's because of the ">" in the string. Adding a space fixes the problem, but I expect people to use ">" without a space. What can I do/research to fix this?

Attached: encode.png (1772x388, 59K)

I keep seeing job listings mentioning having a degree? Surely they are just aiming high and people don't actually need a degree for an entry level web dev job?

UK if that makes a difference

">" should be encoded as >

htmlhelp.com/reference/html40/entities/special.html

they don't, they just want people that can commit to a certain project and don't quit (having a degree).

just say that you don't have money for college and if they complaint, sue them for discrimination

Where do you guys go for inspiration in regards to design?

Confusion alert: What the fuck is going on here?

For some reason JS decides to add the "test" item six times when it really should only add one item. Am i missing something?

Pic related, results i get from running.

function sumTest(){
let l = [];
let x,y,P,P_y = {};
for(let i = 7; i < 10; i++){
x = 2;
y = i - x;
P = x * y;

while(1){
if(P/x % 1 == 0){
console.log("wtf?");
P_y[P] = {"test": "Why is it posting it six times when added just once?"};
}
x++;
y = i - x;
if(x >= y) break;
P = x * y

console.log("This is sum: " + i + " x: " + x + " y: " + y + " product: " + P);
console.log(P_y);
}
}
}

sumTest();

Attached: weird.jpg (1232x400, 68K)

google -> feel lucky -> five pages in -> steal that design

when can you tell that you're competent enough in a computer language that you can move on to the next one? no matter how much I learn/try to learn, I always end up feeling like I don't know shit.

I know it's a stigma to be a googler dev but you can't expect to know everything ever and every edge case behavior or viable alternative, etc.

Post the original formula.

Why the while(true)?

>this algo

Attached: 1334329164853.jpg (366x380, 18K)

nvm didn't see the break

okay, why the while loop?

It's a work in progress, I try to make stuff work in a quite chaotic and fast way, then make it look better once it does work. My way of coding and finding a solution I suppose.

What do you mean?

I just want a loop which is looping, cba figuring out which loop would fit, so i simply make it while true and break it when it's done what I want.

Basically I'm doing a function which takes a sum, then divides the sum up into all possible summands, multiplies the summands into a product, then it should look look at how many factors there are. Obviously it's not complete and that's besides the point.

For some reason P_y[P], which should just add one object {"test": ...} with the index of P, adds six objects of {"test":...} with different indexes ranging from 10-20, which isn't P at all (the first iteration should have had 7 as index, but it has 10, 12, 14, 15, 18 and then 20).

Looks like some fibonacci or greatest common divisor shit. He's trying to cache each iteration and its result in the P_y object.

Hey all, I'm trying to play an RPG Maker MV game in the Firefox browser. Most of the games I've played before run well, but this specific one gets stuck on a "Now loading..." screen when I try to enter certain buildings.

I open the game with the following line:
firefox /home//downloads//www/index.html

The URI of the new tab is
file:///home//downloads//www/index.html

I've tried using the Console to debug it, and I'm getting this error right when I hit the loading screens:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///home//downloads//www/img/tilesets/inside1_E.rpgmvp. (Reason: CORS request not http).

I'm not sure why it was blocked - these are all local files. Does anyone know how I can resolve this issue, perhaps by modifying what Firefox blocks, and preferably without having to modify game files?

Couldn't he just set a flag outside the blog but within each loop to say it's already been done? Not saying it's the best way but the first thing would be to stop the bleeding.

This is original code
function sumTest(){
let l = [];
let x,y,P, P_y = {};
for(let i = 7; i < 10; i++){
x = 2;
y = i - x;
P = x * y;

while(1){
(P / x) % 1 == 0 ? P_y[P] = [(P / x), x] : null;
x++;
y = i - x;
if(x >= y) break;
P = x * y

console.log(P_y);
console.log("This is sum: " + i + " x: " + x + " y: " + y + " product: " + P);
}
}
}

sumTest();


Which makes it even weirder, since the indexes are products of the two entered values of P_y[P]. See pic.

I wrote it in a slightly easier to read way in first post, but the behavior is the same

Attached: weird2.jpg (1211x289, 38K)

The easy workaround would be to install a lightweight web server on your computer and have it serve the /home//downloads//www/ folder on localhost instead.

sudo apt install apache2 -y

or

sudo apt install nginx -y

>For some reason P_y[P], which should just add one object {"test": ...} with the index of P, adds six objects of {"test":...} with different indexes ranging from 10-20, which isn't P at all (the first iteration should have had 7 as index, but it has 10, 12, 14, 15, 18 and then 20).
>i = 7
>x = 2
>y = i - x // 5
>P = x * y // 10
P=10 in the first iteration. Then, x=3 and y=4, making P=12 in the second iteration, and so on. If you expected 7 as index, then did you mean to do P_y[i]?

Anyway I still don't entirely understand what this is doing or why, but I can't imagine this is the best way of doing it.

Pic too damn related

Attached: code_quality_2x.png (1480x517, 115K)

lads what do you do when every company around you uses technology you actively hate?

Do I bite the bullet and move away from my family?

So you want to find a random divisor pair of any given number?

function random_divisor_pair(sum) {
let a = Math.floor(sum / 2);
let b = Math.floor(sum / a);

if(a * b === sum) {
return [a, b];
}

return null;
}

function random_divisor_range(start, end) {
for(let n = start; n

what is the proper way to use the modified style with stylish for this particular site?

Attached: klei.png (1149x503, 62K)

stylus I mean, of course