/wdg/ - Web Development General

Shorter OP Edition

>Getting started
Get a good understanding of HTML, CSS and JavaScript.
The Mozilla Developer Network offers a good intro (no matter your browser choice)
developer.mozilla.org/en-US/docs/Learn

>Free online courses
codecademy.com/
freecodecamp.com/
bento.io/

>Further reading/viewing
youtube.com/watch?v=sBzRwzY7G-k
github.com/kamranahmedse/developer-roadmap

>Useful resources
developer.mozilla.org/en-US/docs/Web - General documentation for HTML, CSS & JavaScript
stackoverflow.com/ - Developers asking questions and helping each other
caniuse.com/ - Check browser support for front-end web technologies

>Useful Youtube channels
youtube.com/derekbanas
youtube.com/learncodeacademy - codecademy
youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q - funfunfunction
youtube.com/user/TechGuyWeb - Traversy Media
youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ - freeCodeCamp

>an in-depth comparison of VPS hosts
webstack.de/blog/e/cloud-hosting-provider-comparison-2017/

Other urls found in this thread:

youtube.com/watch?v=b2F-DItXtZs
docs.sequelizejs.com/class/lib/model.js~Model.html#static-method-bulkCreate
coggle.it/diagram/Vz9LvW8byvN0I38x
twoscoopspress.com/products/two-scoops-of-django-1-11
github.com/django/django/commits/master
github.com/Miserlou/Zappa
youtu.be/2wCpkOk2uCg?t=46m25s
pastebin.com/bn8ALeme
pastebin.com/XFPQfh6i
pastebin.com/6zT5Rqeg
twitter.com/SFWRedditImages

First for MangoDB and its web scalability

Just wanted to share (since you guys are my only friends), I have finally managed to write out an automatically updating clock in Javascript from memory without having to refer to any documentation. Very happy right now, great start to the day. :)

good for you, this was feature was really popular in ~1997

So was the web itself before the dot-com bubble burst and now we're riding a second resurgence. Javascript clocks are coming back baby

I tried freeCodeCamp out of OP's and some other user's suggestions and I dig it.

The HTML/CSS tutorials were a bit more simple than their codecademy counterparts but the project section is good, even if it's just "do this".

Building something from scracth made me realize how little I knew and also learned some new stuff.

I feel like I'm going slowly due to little free time but I'll keep working on this.

I hope to be there soon, but hey, I woke up at 12:00pm well rested, which is not something usual for me.

I've spent my weekend thusfar learning the basics of websites and HTTP. I'm learning all the stuff I should have learned years ago and it's really empowering. Makes me want to make my own message board site to fully engrain everything in my head.

I wish I could quit my job and just spend my time getting good. I really lack motivation and energy after spending all day working. Time helps when trying to sink into something too.

>I really lack motivation and energy after spending all day working
i know that feel
try joining projects with other likeminded autists, it could help

What are some prerequisites to dive into vue/react/angular/etc? Just be good with JS?

I'm not autist though, that's part of the problem. I struggle to focus on this stuff for long and need to take regular breaks to play vidya and shit.

Angular makes use of TypeScript, but for React and Vue some general JS knowledge and the ability to read docs is what you need

How do I create and sell a wordpress theme faam? I'm lost

Lol I'm an autist and get distracted all the time too. It's not autistic to have laser focus on one thing, just that some autists do. Whole condition is a spectrum

Threw together this idea in Photoshop for my portfolio-projects page
What do you think of the general design?
(Didn't bother to really add a colour scheme or put too much effort into the draft)

do you have that many finished projects to show off?
Even then it might be smart to reduce that number a bit and focus only on a bunch of them, that really highlight some of your skills.

What do you plan title and header to be in that example?

Honestly, finished ones I don't - or at least that I would be willing to show off but I plan to finish the site and then use it also as a platform to blog my progress with certain technologies or concepts which will be taking up my time for the next 6mo/a year
The title I'm not sure on maybe like "Projects" but the Header will be in relation to like "Finished Projects" or "Ongoing projects" and MAYBE a scrapped projects section, although if I've scrapped it its probably really shitty and would reflect poorly

I'm storing around 20k records in a sqlite db and it's taking more than 30 mins. There's no way it should take this long right? Is there some special procedure I should do when I'm storing this much data?

I'm using nodejs + sequelite + sqlite and this is what the code looks like:

for(let i = 0; i < messages.length; i++){
Message.create({
text: messages[i]
})
}

do database operations in batch so you don't have to do 20k db transactions

youtube.com/watch?v=b2F-DItXtZs

to add to this:
I am asking because I made a portfolio page and reserved space for 8 or 9 projects, when in reality I didn't have a single thing to put on there yet.
I spent many hours of trying to make that section look nice, that I should have spent on building some content for it instead.

Now I am just using a short greeting text introducing myself, an "about me" section with some info and a list of my technical skills, followed by a contact form and links to github/email and so on.
That was just recently though, so as soon as I have something nice to show off, I plan on putting it up there, but most likely not more than 3 or so at a time.

Maybe I should say that the 30k messages I'm storing is just a line of text each, nothing big.

One, sqlite is slow as fuc, and two you should be generating a bulk insert statement like, INSERT INTO messages (title, text) VALUES ('fuck','shit'), ('piss','hell'); But like 20k times.

docs.sequelizejs.com/class/lib/model.js~Model.html#static-method-bulkCreate

Yeah, I can see that being an issue.
I already have a fair few projects finished and ready to just be put up and others that will soon follow and considering this part of the site won't be going up for some time it's not that which I'm worried about, I'm just trying to get some feedback on the general layout so I can move on.
My site currently just has an about section and a contact section with some links to LinkedIn, Github etc.

Saw this when paying my power bill. Jesus christ

Where does Front-End end and Back-End start?

I'm reading about Server-side frameworks and it's talking about templating, which I do as an FE dev in .phtml files..

Generally front-end concerns the design of the website as well as functionality provided by the clientside JS.

Backend is the code that runs on the server, and may interface with the database, generate HTML, or other things. But I guess templating could be considered front-end work, as long as you're abstracted from the business logic of the back-end.

So what I'm doing right now is actually part backend?

I'm even more confused now.

who wants me to stream me muddling through reactjs / websocket development? i have both reactjs and websockets working already.

Yeah, pretty much.

Back-end basically means server. And that phtml is getting processed on the server, so it's partly backend.

I'm not sure how your templating setup works, but to learn more about backend development, dive deeper into what you already do. Look into the implementations of any functions you call.

the template is processed by the backend, so, by the time the page is sent to the user, all of your template variables, etc. have been expanded out by the server.

the markup and styling is front-end. the logic for generating markup (i.e. loops inside the templates) can be though of as backend
the distinction is not that useful here desu

no-one asked for it, but i'm gonna start streaming web dev at twitch/fmdud now, exclusively for /wdg/

What framework do you guys think would be a better long-term option for my team, Vue.js or React.js? Or angular 2? Our backend is .NET.
Any advice?

the one the most of your team likes more

Whats the simplest way to display a sent text-form 1:1 with the line breaks and formatting?

>Our backend is .NET.
find a new company

vanilla javascript + jquery at most

Just a simple question, what's the bare minimum you need to land a job?

HTML, CSS and JS?

Do people get hired just to edit HTML?

Don't see why they would considering it is piss easy (HTML).
Not working as a webdev but I've looked at it a little:
coggle.it/diagram/Vz9LvW8byvN0I38x
This seems to give a general idea as to what to learn, you don't have to learn all of it and when it branches out from say "Scipting Languages" it's advising you to learn one of them, not all of them.

Thanks, that's really helpful.

Also, it is recommended to now a bit of back end even if you focus on front end?

I'm just learning, already familiar with HTML and CSS, a bit of JS. A friend works as web developer and told me that knowing Php or Python would make me a great favour to find a job.

I don't think so, unless your goal is to become a fullstack dev.
Generally for Front End I'd say look into strengthening your general skills and look into frameworks like Bootstrap, which even if you don't use you can look at how they've done things and learn to do it yourself and maybe even improve on it, I've actually learned quite a bit from just reading through others code every now and again.
Get familiar with GitHub and technologies that frequently come up - Node.js, Angular, TypeScript or CoffeeScript etc.
That's my take on it anyway, my career isn't web development so it's just sort of a hobby/plan B that I sometimes use to personalize my own site or one offs.

Front end dev here.
HTML, CSS, and JS are the bread and butter for web dev, so yes, knowing those 3 are essential. Well, knowing HTML fully is essential... CSS and JS you can know to varying levels (ex. back-end dev should know HTML along with a backend language, but basic CSS and JS knowlege for a backend dev would be fine).

Also, yes. Some people do get hired just to edit HTML (and a little CSS sometimes). I know a couple, and their job titles are usually along the lines of "Content Editor" or Web Content something-or-other". Not too terribly common though, and I imagine it would feel more like data entry than web dev. I actually wouldn't really call an HTML only job a developer job, but whatever. Also pay is not developer level.

Learn HTML and CSS and get good at basic JS, and you'll be on your way to finding a decent junior dev role.

imo learn ruby/rails. It's gonna be by far the easiest backend work to get into as a previously frontend only dev. I used to work as a rails developer and it was pretty good work. Rails contracts go for upwards of $500/day in major cities. Frontend devs get abused far more than backend devs, but if you want to focus on frontend, focus on strong, well-programmed javascript. Forget jQuery, learn yarn/npm, gulp/webpack, es6 w/ babel, React, etc.

Also, to add on to this, If you're focusing of front end, it's not necessary to know any back-end languages. These days, your time would be better spend mastering CSS and especially JS, and learning a framework.

That being said, learning the basics of a backend language would always be helpful, and even if you don't end up using it in a job, it'll give you a better idea of how everything in web dev works as a whole.

I'm an FE dev of 2 years, looking for a new job. Should I look at JS framework jobs (which I'd need to learn) or should I see if I can hop to back-end? I thought the pay was quite comparable.

Hey boyos, what are we working on?

>just "finished" twitter dashboard with Rails, Sidekiq, Redis, that lets someone get keywords, filter them on front-end, and save them to a sortable table

>trying to decide if I should make it better, start learning react, or start learning node.

Should I learn React or Angluar assuming I want to get a front end job ASAP?

Do I even need to learn a front end framework/library other than jQuery?

Nice infos user.
I'm pretty comfy with HTML/CSS and can quite easily bring myself back to speed to be thorough with JS.
Say I do learn npm, gulp, babel, React/Angular
what do you think my odds would be of finding a job in a major city relatively quickly?
I also have experience with jQuery, CoffeeScript and general languages such as Python w/ Django
(Not original help needing user)

GOOD frontend devs earn about as much as backend devs. But good frontend devs nowadays have strong software engineering backgrounds and understand how to write good, modern javascript.

In the end, a lot of firms just see frontend as the people who turn photoshop psds into html, and pay them accordingly. I've found the further towards the backend I've gone, the more I get paid for the amount of work I do. This might be because I've never been a good frontend dev, though. I know that the company I used to work for sold me doing Rails/React/Consulting for about $1000/day. I don't see that much now that I'm contracting alone, but now that I've moved into DevOps i'm slowly approaching that.

Backend isn't quite something you "hop into". It's always best to come from a purely software engineering background if you're going into backend web dev. How's your linux command line? How're your software engineering fundamentals? If these are bad, learning good JS frameworks are going to be just as tough as going into backend.

also, learning Angular or Ember or whatever is fine, but in 2 or 3 years when those frameworks are dead, you're either going to have to entrench as a legacy knowledge base or abandon what you've learned so far. IMO react is here to stay (because it's actually well-engineered), but my advice is pick what you learn very carefully in Javascript because what constitutes good javascript changes on an almost weekly basis.

Sorry not sure if I answered your question but that's hopefully a helpful braindump

I think the part about JS frameworks becoming obsolete is what scares me most.

I enjoy front-end, but I have so much to learn on the JS side of things and I've told my boss that I'm leaving, so I should get to stepping ASAP.

I dunno if I could jump into a BE role as I am. Either way, I'm a noob so I'm looking for junior roles.

I guess maybe go into a JS Framework role for now, learn that business, and perhaps go into BE after that? Would that be possible, or would I be starting pretty much from square one yet again?

well it's up to you.
I decided early on to never learn jQuery properly, because I always knew that generic html/css/jQuery frontend is incredibly bad programming. I've found success by using my intuition and making opinionated decisions as to what I consider bad and avoiding it as much as possible.

The general idea is to just say you can do it, whatever it is. But take time to learn the things that you think are good, because if you do a good job you will make contacts during your work who recognise you are good, and will willingly vouch for you on jobs/contracts that they might find in the future. Also do this for other people.

My advice is focus less on what people want and focus more on being a good programmer.

I've gotten interviews and thirsty headhunters finding me based on the fact that i'm in the contributors list for open source software projects that I thought were good while they were young and then became popular. Example: I contributed to Docker back when it was pretty in (in 2013), and I've had countless companies and recruiters contact me based on this and other contributions I've made. Show the world you're good and job offers will come to you. Don't just say "Oh i went to uni and i had an internship and now I want a job". I've had people come and work with me with masters degrees in comp sci from top Unis and then it turns out they're fucking useless and can't program at all. If a company is already running your code based on your open source contributions, you're much more likely to get your foot in the door.

pic related

I'd say fairly quick, especially if you get to a comfortable level with a framework AND have a decent portfolio that employers can look at, so that they can actually see that you can do what you say you can do on your resume. It's pretty hard to find a job posting nowadays that doesn't mention React/Angular/etc.

But most importantly, don't just learn "how" to use all those tools and frameworks, but also get to really understand the fundamentals behind them. I'd spend alot of time getting good with plain vanilla javascript and ES6.

Alright, noted - thanks user.

dont look at any of this like "starting from square 1". If you like Javascript and want to learn it properly, then learn it, properly. Apply for junior roles at companies that do good work. There's nothing worse than being at a company that teaches you to do things shittily. Take a pay cut and ask questions every day, for years, as if every day was your first day on the job. Even when you're a senior dev, ask questions. Don't be afraid to look like an idiot. Gather as much knowledge as possible and then hop jobs every 1.5-2 years and look for 1.5x to 2x your current salary.

Thanks

You say 'companies that do good work' but I don't think it's likely I'd be able to land a job without using a job-search site, which don't tell you the company (unless the vague descriptions are useful enough, but I don't suppose they would be).

I think your advice is great, but this part might be difficult. (On a side-note, fuck recruiters. I ask for Front-End jobs, and they throw full-stack shit at me, without job-specs ((I will stop accepting interviews without job-specs, it's beyond embarassing now)), way beyond what I'm capable of. I'm also very honest so there's zero chance of me getting these roles even if I wanted them)

> I'm also very honest
cut that shit out for a start.

>I don't think it's likely I'd be able to land a job without using a job-search site
more open source contributions. Join local meetup groups for your language. I gave a talk at the London Ruby User Group and I got a bunch of extra interest off just that. Network IRL, it's way better. Go to hackathons at conferences and give lightning talks, they let anyone do that shit. I gave a lightning talk at one of the EU DockerConfs. I didn't even apply, they just ask you. A competent programmer looking for work is a very rare thing. Show good CTOs that you are a competent programmer looking for work and you won't be out of work for long.

Also this is shit code, don't use loops:

messages.forEach(text=> Message.create({ text });

but yeah, you should obviously be using bulk inserts and another other than sqlite.

Is Django deprecated now?
And does it exist any good books for other frameworks like this one?
twoscoopspress.com/products/two-scoops-of-django-1-11

github.com/django/django/commits/master
>last commit 2 days ago
I think not

I meant deprecated for top developers jobs and new projects.
Everybody uses graphql, server less architecture, hybrid rendering and so on and django was not written for this kind of stuffs.

Zappa is much better and future proof than Django.
We shouldn't use Django anymore now and please don't fall for the JS meme.
github.com/Miserlou/Zappa

Looks interesting desu, I'll check it out tomorrow.

getting more into DBs

>webdev and thinking that JS is a meme choice for anything
I will never understand this. Especially with ES6+ features and how nice Node is.

There are obviously lots of things that JS is a meme choice for, but web is obviously not one of them.

seems to keep a pretty stable popularity over the years and not even dipping like some of the others

dumb question, but I am following this video
youtu.be/2wCpkOk2uCg?t=46m25s

When checking my console I keep getting the error: Uncaught TypeError: Cannot read property 'value' of null
at HTMLButtonElement.

From my understanding this is because the script is acting before the rest of the document has loaded? I have script tags at the end of the body tag. Any pointers on why I have this error?

Yes devs use it just because it works and are not paid enough to evolve anything.

I made a lookup tool with ssl/link checking, pagespeed benchmarking, and email dns checkers.

I need to put in a form validator for the domain lookup before I upload the git and make it available. Any other suggestions I could improve this lookup tool with?

Should I already learn golang or wait for golang2?

Hello, friends. What is the best MySQL or MariaDB gui program for Linux. I'm coming from MS SSMS as a reference point and Emma, which I'm currently using, seems very primitive in comparison. Also, is there anything better for Postgres if I ever started using that?

I don't think it will change too much

DBeaver

Tomorrow I start my mid-level role.

I was entry-level for the last 4 months.

Just 5 months ago I was making 10 dollars an hour doing security for 2 and a half years.

/wdg/ molded me. Thanks.

Could you post your code?
Programming is relatively exacting; without seeing what you've done (or...not done?) we can't really help. The error you're giving is also unfortunately rather vague: it just tells us that you're most likely trying to find an element, via something like document.querySelector(). This means that the browser can't find whatever you're trying to get the 'value' property of.

The querySelector method (as well as related methods) actually rarely returns an error. If it can't find the element you're indicating with the selector argument, it'll just return 'null'. Null, being null, has no methods or properties.

You're right that order of execution DOES matter with JavaScript. If the script doesn't run after the object in question is created, it won't be able to 'find' it.

Thanks!

Some hard core grid illusion going on there.

I'm looking to buy a windows host. How much should I be looking to spend on it?

Azure is charging $14/month, godaddy $8.00/month. Is this about right?

What are some projects that could help me get hired?

myinstafacechantubeddit.ru

Am I the only one who goes on to stackoverflow for something programming related, then wander off to hot rpg stackexchanges questions, even though I don't even roleplay?

I do that every day at work.

Isp if any, geolocation?

That's up there with some of these phone number memes desu.

SQLite's limitations don't come into play at this type of scale.

Pic related, it's 50,000 inserts in 0.063 seconds. Whatever's going on here, I'm blaming the fact this looks like JavaScript.

where do you see 8$?
in any case godaddy should be avoided.

>Is this about right?
windows license is always about a 14-16$ per month premium on top I think

Is server less web development the future?
I currently host a 300k visitors/day website for $11/year on AWS.

No.

That foreach is way way slower than a for loop btw.

What is the best way to align blocks in a line, for example in a navbar.
Float: left, display: inline-block, flex or something else i don't know of?

>tfw professional wordpress and angular 4 developer earning 6 figures yearly

How? AWS is more expensive than that.

There was a Sup Forums blog on how much it would take to run Sup Forums on AWS and it was like hundreds of thousands a year.

"serverless" is a trademark of one framework unfortunately, who've completely taken over what should be a generic word.

Serverless has a history of obvious shilling on Reddit and HN.

>imo learn ruby/rails. It's gonna be by far the easiest backend work to get into as a previously frontend only dev.

I agree. Rails saves you a lot of headache and you can get into details later on.

>Backend isn't quite something you "hop into".

I wouldn't agree here. I have yet to see the Rails dev that needs to code a turing machine, scheduler, hashing algorithm, or A* algorithm.

Especially in our modern framework world where there's an library for everything. You have to do really really crazy stuff to make something with rails (or any other big mature framework, that is) where you can't just import a library and are done.

The actual modern "backend working process" is about 80% doing research which library to use, googling how to configure stuff and using a little glue code to make the differnt peices interact. Only for the additional 20% you need to actually "hard code" things out. But even here you will probalbly read tutorials to similar topics and try your best to make it work.


>also, learning Angular or Ember or whatever is fine, but in 2 or 3 years when those frameworks are dead

Right now I think Vue might be worth investing time, since it's going up and super simple. If you add some Node (which is only JS) you're almost there.


>I think the part about JS frameworks becoming obsolete is what scares me most.

It never will. Never.

BTW you think way too much. Most companies are glad to find someone doing full-stack, so if you are great at Frontend/Design and JS..

Just learn Node.JS, it was basically made as entry for frontend guys like you.

The one big technology which is a must in Backend is databases. Just take a few days to weeks to really dig deep into SQL. It's always important, and if you know how to index properly, avoid the common SQL pitfalls and can explain the second normal form you will already outperform 80% of all web devs out there.

And learn some basics of MongoDB, it's easy and fun.

>laravel vs django
>react vs vuejs
>react native vs xamarin
>neovim vs atom vs vscode
>macos vs win10 vs ubuntu vs archlinux vs fedora
>digital ocean vs ovh
>mariadb vs postgresql vs mongodb

I should have provided the code, that was my bad. Hope pastebin is ok!
>html
pastebin.com/bn8ALeme
>css
pastebin.com/XFPQfh6i
>js
pastebin.com/6zT5Rqeg

You could use jsfiddle to share them all in one link instead of pastebin

>>laravel vs django
Node.js
>>react vs vuejs
Vue.js
>>react native vs xamarin
weex soon maybe? never did native mobile
>>neovim vs atom vs vscode
vscode
>>macos vs win10 vs ubuntu vs archlinux vs fedora
any linux distro or win10+bash. Personally makes no difference except that on ubuntu I am less inclined to procrastinate
>>digital ocean vs ovh
Vultr / Scaleway. (DO is fine too, ovh is not)
>>mariadb vs postgresql vs mongodb
fuck do I know?

>document.getElementById('item').value;
there is no element with id "item" in your html

bought a vps but dont know what to do with it