/wdg/ - Web Developer General

Moot was a web developer

Previous Thread:
>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
Start your own project, no better way to learn and stay motivated.

>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: 1520567472552.jpg (700x700, 51K)

Other urls found in this thread:

docs.microsoft.com/en-us/dotnet/csharp/tour-of-csharp/index
microsoft.com/net/
docs.microsoft.com/en-us/aspnet/mvc/overview/getting-started/introduction/getting-started
medium.com/refactoring-ui/7-practical-tips-for-cheating-at-design-40c736799886
twitter.com/i/moments/880688233641848832
pages.xyz/
developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/Dealing_with_files
hackr.io
tobiasahlin.com/typesource/
twitter.com/AnonBabble

am i the only one who buys old used phones off ebay for web testing desu
its fun though

I want to make a simple web app (daily planner) for my own personal use only. I have a domain name. Is there a cheap or free web host I can use for very light usage?

I do systems level programming mostly and am unfamiliar with web dev. I think I want my 'stack' to be react front end and everything just pushes and pulls to/from a simple sqlite database. Does that make sense?

How do I go from being able to hack together a poorly written javascript plugin to actually being able to make useful reusable code that people would star on github?

You need to solve a problem people care about. I only star things on github that are useful to me in some way.

So create something other people will actually use, advertise it in the right places and watch the stars roll in. Also give your project a name and description related to said problem so people can actually search for your repo

...

Simple Question:

Loading some json files specifying their path for my React app.

What's the way to make this consistent in both development and production.

Right now (in dev) I'm actually typing the PATH name to take. What's the fix for this?

why would the way you load .json files in your project be different in dev and production?

Ok it's good that you want to do this but are you wanting to write all the code yourself? And *start* with React? Do you have any experience at all in JavaScript, specifically actual JS (vanilla) and not the bits and pieces stuck onto it (the frameworks, e.g. React)

This is probably a ridicuIous question, but how can I find something that people care about?

Is there any general formula I can use to find people who could use a software solution?

lol
autism 2 strong

I have solved it by doing something like this in my webpack config.
When I develop locally I have a .env.json-file.
//.env.json
{
ROOT_URL: 'url'
}

//webpack.config.json:
{
....,
plugins: IS_DEV ? new webpack.DefinePlugin({
'process.env': read contents of .env.json file and put here
}) : []
}

Then I use process.env.ROOT_URL in the code.

What is more efficient for read/writing files with node, json or xml?

I don't have much experience in *real* JS, but I usually treat it as a basic ECMAscript thing where I don't have to care about memory really. I know it has its nuances but I've used it in other contexts in a very basic way (JS with QML and I made a C++ application that used a JS API on top of an embedded JS engine). So I have zero expertise in JS and don't know any of the 'gotchas' but I want to use React because it seems like the easiest way to create a planner. Visually I want it to look like a daily view calendar for example. If there's a better set of tools to use vs React I'm all ears. It just seems popular so there's lots of SO content, forums, etc I can scour if I need help.

No you need to be 'involved' in some kind of software scene in some way. If you don't have one, look at your interests and pick a project that way; start out developing your project and think of the tools that would have made your life easier. That's the sort of stuff people care about on github.

If I'm in the US and I get a remote job in Australia, what kind of taxes are I'm looking at?

not a question you should ask Jow Forums hit up your local tax planner

So, a MEAN stack exists, that makes you work mostly with javascript.

Is there such a thing for python? Can I get rid of all the php and javascript and go full stack python?

who /php + web forms + jquery/ chad here

Attached: 1515647746581.jpg (480x360, 15K)

jamstack is where the fun is at
meanstack is so 2000 and late

also have you just like... searched "full stack python" lol

lol why would you not want to use javascript
javascript is the final red pill
also fuck python

The entirety of India, congrats on being a Pajeet-tier programmer! WOO!

I'm using Linux as my development environment. Is there a recommended web server I can use offline to get started without paying for hosting?

webpack / browsersync

>webpack
?

>webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging just about any resource or asset.

That's literally entry-level brainlet tier

I already have some basic javascript knowledge, it's just that I've been focusing on Python for AI and Data Analysis and I thought it could be neat to have some Flask and Django knowledge under my belt as well. Having a full python alternative would be more efficient, learning wise.

I guess the answer is no, then. Ok!

>spoonfeed you 99% the answer
>still can't figure it out

You're not going to make it

Web pack is already made, dude

>I guess the answer is no
literally just search full stack python you mouthbreathing retard there's an entire site dedicated to it

This shit is overwhelming, I want to learn everything but there's no fucking time.

jack of all trades, master of none

oftentimes better than a master of one.

welcome to life bitch
how about you actually focus on something that really tickles you

once you get a job and hold it for more than 3 months youll never want to look at this stuff on your free time again so that feeling will pass dont worry

Just use your own machine as the server. Xampp is a simple program you can use to set up an Apache server and Maria database on your local machine for testing purposes. I've used that in the past for developing php webpages for a linux environment.

Or you could use Visual Studio with NodeJS. That's what I'm playing with right now. It will launch the webpage on your local machine.

learning everything is retarded. just pick something and learn as you use it

>tfw you spend company time learning all the little things you wanted to learn and get paid for it

Attached: what are you reading this for.png (540x675, 484K)

>inb4 self-employed

>full stack python

and the answer is fucking "no"?


>JavaScript executes in the client and enables dynamic content and interaction that is not possible with HTML and CSS alone. Every modern Python web application uses JavaScript on the front end.

I've been doing web development for about two years in my spare time. I started out with your essential front-end technology stack, and I've progressed since then to building two or three small-scale full-stack projects that use basic CRUD APIs. I've been trying to find a job since around November, and I get hits but they never seem to lead anywhere. I've also learned not to take 95% of recruiters seriously.

C# seems to be immensely popular in my area for web dev, but I've hardly worked with it or Visual Studio. Most of my time has been spent in Python/Flask and Node.js with some databases like SQLite and MongoDB. Does anyone have any recommendations on good sources to learn C#? I have a copy of Pro ASP.NET MVC, but I wanted to hear some opinions here.

Are all pythonistas this retarded?

t. developer evangelist

docs.microsoft.com/en-us/dotnet/csharp/tour-of-csharp/index
microsoft.com/net/

Just google stuff. That's how I learned MVC. Books are dumb.

the msdn tutorial for mvc is very thorough.
docs.microsoft.com/en-us/aspnet/mvc/overview/getting-started/introduction/getting-started
from there, go on to the next mvc tutorial that uses entity framework

Thanks guys.

the problem with (specific framework/language) books is that they're hard to correct
digital books in the form of like eloquent javascript for example are better because they can correct/change things whenever

Just pick a stack. I was in the same position as you when I first started. Play around a little bit with everything MEAN, MERN, Python/Django, JAM, LAMP, etc.. and just pick the one that you don't want to kill yourself when working with it. For me it's been MERN so far.

As for stuff like databases and authentications, you'll work with it once you need it. So just try your best with them. Just being familiar can help you learn new stuff in the future.

And if you're learning to find work, look at all the dev jobs offered in your desired area, see what the common stack is and just learn that.

Attached: 714F5GrOpdL._SY717_.jpg (477x717, 98K)

Is there some plugin or whatever that lets me load the XUL Firefox addons I have installed and easily tweak them? Doesn't need to necessarily save the changes to the addon, I just want something to facilitate hacking the codes of various addons together.

Attached: aa6d729d1eefb8a4b97f7aa43c21a674197b10b7b5809dcb85699e6e95d7be79.jpg (500x383, 46K)

>M$ MVC
fug, that looks uncomfortable as fuck to work with.
I can't imagine using anything but a decoupled "Vue/React API" setup in those cases where I need a backend.

what do you do now?

>put himself in a box
literally making yourself worthless

already am

I use MVC for my job. It's pretty nice to work with since it gives you easy integration with other microsoft stuff. If your work uses a microsoft stack then it's the way to go.

I wouldn't use it for personal sites though. That's why I'm learning NodeJS on the side.

Is there any list of front end web development challenges I can try out? I want to polish my skills

What do I need if I want my server to just query and save data from/to an sqlite database?

WebPage sqlitedb

I don't want the sqlite db to be accessible outside of the web page and want the web page to have a user and password based access. Do I need any special server side thing for that?

What's a good way to "practice" design skills? Just look at stuff like wordpress themes and try to recreate it? Is there a good place to look at examples of well designed sites?

find concepts on dribbble or wherever and create them
but that's not really practicing design skills, that's just practicing design to code execution and design is way more than that lol

I mean you pretty much already know what you need.
A server and some way to authenticate users and their requests.

for databases there are tons of libraries you can use.
For authentication "passport" is fairly popular.

practice by creating things and actively taking note, whenever you see something well designed and note why it looks good.

Some potentially interesting links:
medium.com/refactoring-ui/7-practical-tips-for-cheating-at-design-40c736799886
twitter.com/i/moments/880688233641848832
pages.xyz/

...

developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/Dealing_with_files

>It's better to separate words with dashes, rather than underscores: my-file.html vs. my_file.html.

??????

Attached: inquisitive.png (349x382, 6K)

literally just keep reading
>The short answer is that you should use a hyphen for your file names. The Google search engine treats a hyphen as a word separator, but does not treat an underscore that way. For these reasons, it is best to get into the habit of writing your folder and file names lowercase with no spaces and with words separated by dashes, at least until you know what you're doing. That way you'll bump into fewer problems later down the road.

>The Google search engine treats a hyphen as a word separator, but does not treat an underscore that way.
Damn that's absolutely retarded.
The other way around would make more sense.

>that's absolutely retarded.
it isn't.

Not him but hyphenated compound words aren't two seperate words vs underscores which aren't used in normal english. Why wouldn't you use underscores instead?

In Java, you can use underscores for better readability
int a = 1_000_000; // same as 1000000

instead of
int a = 1000000;

>when you try to delete a project on windows 7, but you can't because the OS says "the hierarchy is too long for deletion, please move the files to another directory or rename it"

Attached: node_modules.gif (709x351, 354K)

I don't think I could develop (the way I currently do) on windows without WSL.

A product of every web developer wanting to be a programming superstar and setting up their online reputation with bullshit like 'is_number'

At least my bitter mind assumes so. This webm reminds me of when I would stash my porn on the HDD.

What do you guys think about fading in the page on load? A sexy thing or just unnecessary?

Attached: css.png (301x115, 5K)

Would look stupid for the navbar to fade in after clicking a link on it. Throwing it on a content container would be fine though.

>node_modules/library/node_modules/library2/node_modules . . .
Jesus fucking christ this can't be real

Either the page is loaded or it isn't, don't waste peoples time making them sit there waiting for some animation to display shit.

fade in some of the text / images/ whatever not the whole page

Should I bother supporting pajeet browsers?

Attached: UC_Browser_Logo.png (300x300, 26K)

What's UC browser lacking in support? I feel like it's generally not bad when I look at caniuse.

Plus caniuse says it has 7.5% global usage, which is a pretty decent chunk of people, although I think it's mostly china and india.

Can you not? Why are web designers such tacky idiots with a horrible sense of design?

npm has been improved since then to flatten the modules for Windows

you just added a whole second to pageload.

1. Pick a cute project name.
2. Use an anime girl avatar.
3. Wear white panties and stripped socks while coding
4. Buy one of those dildos that ejaculate
5. ???
6. Profit (i.e. get lots of stars)

>hackr.io
>"Why developers like this tutorial"
>"Video quality" is higher than the important things like "content quality" and "pacing"
never trust users

Why aren't HTML documents just created completely dynamically? Is there any reason I shouldn't just build up my HTML using the DOM JS API?

SEO is a concern, although Googlebot executes some JavaScript nowadays. Also time to first paint will be a bit longer, especially since you have to load and parse your JS, load and parse whatever libraries you're using, and load wherever your content is coming from (JSON API?) before you can even start rendering.

I'm intrigued by lisp and wanna make some API with common lisp.

But I have absolutely no idea where to get started.

Since I want to build an API it might be cool to make a dynamic site to get into it?

waste of resources

>especially since you have to load and parse your JS, load and parse whatever libraries you're using, and load wherever your content is coming from (JSON API?)
This is the crux

You have to weigh those different options against one another.
Rendering the view with JS can still be done right, if you load and parse the immediately needed JS first and lazy load in the rest afterwards, that's not critical for the first render.
Plus if you put in some effort and are aware of what goes into your bundle and don't just add every shit library you come across, then your site will naturally be only a fraction of the size of the bloated shit you see out in the wild.

Goes well together with pre-rendering.

Web development in general seems like a waste of resources. Loading MB of data just to load a crappy ugly web page designed by some starbucks sipping sad sack of shit who places usability and functionality at the absolute bottom of his list etc

The web is so fucked why even care? Tons of ads, autoplaying videos on every news site, etc. I have no expectation for a web site to be performant or efficient. May as well go balls in with pure JS dev because then everything is in a single language

I hope you mean "For everything" because that is a fucking retarded hierarchy, flat out

>cheap for very light usage
nearlyfreespeech.net
>react
Seems bloated, but okay.

Server-sided rendering + HTML tends to be faster with better support.

No.
Latest 2 version of Edge, Firefox, Safari & Chrome. Fuck the rest, unless you have 1M+ monthly users.

Why?
Parts of the page probably load before your CSS, unless you want to inline just that part. Suddenly the page fades out and in again, probably while I was starting to read.

>Web development in general seems like a waste of resources.
seeing as it's really easy to get into and we have anons wanting to "make everything dynamic", you can clearly see where the issue stems from

>Latest 2 version of Edge, Firefox, Safari & Chrome. Fuck the rest, unless you have 1M+ monthly users.
Not the user you replied to; but I wish I could tell my boss this.
Imagine having to create another conditional CSS file just for IE. Fml.

this is nice
tobiasahlin.com/typesource/

I pulled our visitor statistics and distributed time spent optimizing for each browser to its usage share.

When you can go to your boss and say 'Hey we're spending 20% of our time on 0.8% of the users', they can't really argue against you... Unless you got 1M+ users and 0.8% is 8000 a month.

>mfw I have literally never starred anything on Github ever
Why is everything on there so overcomplicated and useless?

Attached: 1469120554147.png (449x442, 151K)

Yep, demonstrate to them that they're losing money by catering to x and they'll change.
The reality is though for a lot of these companies still supporting older browsers is that they're either crucial websites that need to work on everything (gov sites, bank sites, etc) or they have massive clients who utilize that specific browser. Which can be a pain but, it's what you sign up for if you work at one of those places. It's no startup environment lol

To me, extended browser support means "Every feature we offer that is available to one browser is available to the big 4 browsers, desktop and mobile"
Forget CSS. End users don't care that they receive an identical visual experience on every browser. They want an identical interaction experience on every browser.

Frankly, with the newest JavaScript support it should be impossible to fuck that up. There are only a handful of websites I know of that literally perform different functions depending on which browser you're running (Nintendo comes to mind), which is absolutely horrific and fragile as fuck in 2018.

Think I solved the React/Angular/Ajax/JS dependency problem.

See I'm making a shopping cart, and input feedback is very important here.
The customer must see effects of their input so they have a so called sense of commitment.

Page reloads are actually wanted here because of that.
When they add another item they need to see that their cart has changed.

Just popping it in the list with JS DOM manipulation isn't impressionable enough.
Sure you can add some transition effects but it's still just a (seemingly) inconsequential UX modification.

But then you run into another problem - see I'm letting users input other things here,
things that shouldn't lead to/require another form and another submit button and another reload.

So what do I do then? Do I load a complete front-end framework for persistent data?
"No!"

What I do is

>keep track of inconsequential user input
>commit to localStorage/cookies on change (something like medium.com/outlook AJAX drafts except w/o backend work)
>on reload use that data as default

That way you both have persistent inconsequential data, and you don't need a backend-frontend data bridge for simple manipulation.

Thoughts?

That doesn't seem to be a problem for Amazon.

>Just popping it in the list with JS DOM manipulation isn't impressionable enough.
>Sure you can add some transition effects but it's still just a (seemingly) inconsequential UX modification.

How is updating the price not enough?

I think you're trying to reinvent the wheel. just use angular.