/wdg/ - Web Development General

Previous thread
>Discord
discord.gg/wdg

>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.wikipedia.org/wiki/Comparison_of_web_application_frameworks
[Gist] backendDevelopmentBookmarks.md

>Useful tools
pastebin.com/q5nB1Npt/ (embed)
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/ (embed)

>How to get started
pastebin.com/pDT82mQS (embed)
pastebin.com/AL6j7GEE (embed)

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

Other urls found in this thread:

stackoverflow.com/questions/19183180/how-to-save-an-image-to-localstorage-and-display-it-on-the-next-page
fusioncharts.com/blog/2013/12/jsdoc-vs-yuidoc-vs-doxx-vs-docco-choosing-a-javascript-documentation-generator/
github.com/wsargent/docker-cheat-sheet#exposing-ports
wiki.python.org/moin/DocumentationToolshttps://wiki.python.org/moin/DocumentationTools
stackoverflow.com/questions/43009883/making-a-post-to-mongo-database-using-redux-saga-redux-saga-mongodb
git-scm.com/book/en/v2/Getting-Started-About-Version-Control
cerotec.net/contador.php?t=5&s=2&i=82706
learngitbranching.js.org
twitter.com/NSFWRedditImage

>hm, better way would be to duplicate the code like it is normally done...
These are the fucking people I have to work with.

REEEEEEEEEEEEEEEEEEEEEEEE

It's true though. That's exactly what you should be doing.

user checking in from 2 days ago about having a web dev interview with no experience

For some reason there was no technical question, and I was able to get it by throwing out buzzwoods like docker, angular, node, etc. Time to learn!

It's not terribly uncommon to give jobs to people with no experience in a language.

You still have to pass your evaluation though.

tell us about the job. How did you get the interview? Where are you located? Degree or not? Salary? What langs you code in?

He said he has no experience and has to learn everything.

Basically a mcdonalds employee that knows the name of a few languages and pretended to know then.
He will be fired his first week

Is it normal for working in PHP for more than a few hours at a time to make you want to suck-start a shotgun?

what are your thoughts on bootstrap?

Angular and node are not buzzwords mang

Completely normal. I also experience it when I have to work with Java.

Use it all the time, why not? No point in coding something from scratch if others have already done it for you.

Joomla? Magento? A large Wordpress website? I'm so sorry, my man.

Can JS save files on the hardrive and have access to the harddrive?

WordPress plugin

//$p->field_number is 1.6
$i = intval($p->field_number); // 1
$d = ($p->field_number - $i) * 10; // 5 ?
$d = intval(strval($p->field_number - $i * 10)); // = 6
php_sublib14_end_life_routine_without_arguments('true');

Many languages have issues when dealing with floating point aritmethic.

Aye, the kicker for me was discovering that 1.6 was treated as a floating point number, because PHP has no fixed-precision data type.

Only cookies.

and localstorage,cache and indexeddb
but no direct write access to harddrive, only browser provided apis

> localstorage
What is this?

browser provided api to save data
you can usually check these things content in your browser's dev tools
just google the apis, i think some of the most recent ones like indexed db are not fully supported in trash browsers

Can I save a couple of images in localstorage?
How can I copy those images from localstorage?

haven't use this stuff in a while but you shouldn't have problems finding help for this on the internet
first search result :
stackoverflow.com/questions/19183180/how-to-save-an-image-to-localstorage-and-display-it-on-the-next-page

i wanted to do what when i didnt know it good
when i get lost in ' "

I don't get docker. I'm testing it out with a Django site served on the localhost. I can run 'python3 manage.py runserver' fine from the command line and access localhost:8000 but if I try it through docker, it build perfectly well and there's no errors running a container with the output matching that of the command line way, yet I go to the address and I only get a 'connection reset' error. I looked into it a bit and it seems that the docker daemon/your container has it's own IP separate from the system you're running it on but I tried docker inspect [container] and the IP there gave the same issue.

Here's my Dockerfile:
FROM python:3.5
ENV PYTHONUNBUFFERED 1
ADD . /src
RUN pip install -r /src/requirements.txt
WORKDIR /src
CMD ["python", "manage.py", "runserver"]

Base64 with image/jpeg header, my dude

How would you guys write documentation for an API for a small project? I'm only working with 2 or 3 other programmers. The site receives POST and returns JSON.

working on making a radio station with websockets in C. Host sets up a playlist, client receives an audio buffer and plays it. Host's audio buffer just sends out a buffer every second.

I'm probably in over my head since I've never done anything with video or audio streaming

Use a documentation preprocessor

fusioncharts.com/blog/2013/12/jsdoc-vs-yuidoc-vs-doxx-vs-docco-choosing-a-javascript-documentation-generator/

I should have mentioned I'm writing the backend in Django.

you have to map the ports from the image to the host.
github.com/wsargent/docker-cheat-sheet#exposing-ports

Do you use tokens?

Use a Python documentation pre-processor:

wiki.python.org/moin/DocumentationToolshttps://wiki.python.org/moin/DocumentationTools

Yes. That's how users are able to login and manage things.

thank you

>never done anything with video or audio streaming
>C
Are you a masochist?

I assume it's as simple as sending a buffer of audio data via websockets to the client, right? I need to use an mp3/wav/whatever library to get the data into a buffer and they every second just fire off 1 second worth of data. Writing a loop for playlists ought to be easy

If you can optimize it

I did that. I'll try again with a fresh perspective some other time as I probably missed something. It's not central to my project but it'll go a long way in making it scalable, plus it looks like handling nginx through docker is quite easy.

i got that code to improve my work on our shitty cms:
javascript: (function() {if (fsON == null ){var fsON = -1; }if (fsON==-1){$("button[data-action='fullscreen#start']").click();}else{$("button[data-action='fullscreen#finish']").click();}fsON = -1*fsON;$("button[title='FullscreenToggle']").click();})();

the script actually clicks the button "fullscreen#start", but variable fsOn remains -1 seems like somethings wrong with "-1*fsON" so it won't execute the else argument.
any ideas what's wrong? i'm an absolute noob in js.

fsON is always null because you set it inside your if scope and it's gone the next time the method runs.
remove "var" in front of it or declare it before you declare the function.

nice, that actually coincides with a js-validator output, just didn't know exactly what to do. thanks, i'll try it out.

Let's say I want to create/maintain websites for small businesses. What is the reality of tasks and responsibilities this position entails?

Angular 1.x question here

I'm using ng-repeat in a web app to render a page with data from a json array. The problem is its a lot of data so it took a long time to load. So I used Infinite Scroll to deal with that. The problem now though is that the search filter won't work with data that has not been rendered onto the DOM. So items that aren't on screen won't show up on search.

Any ideas on a happy compromise? I need to keep the Search and I'm thinking of using pagination instead of infinite scroll, but that won't solve the search issue.

* find client
* define scope of project
* make commercial proposition
* don't fuck up time estimations in proposition
* charge according to time estimation
* get client to accept proposition
* do the suff you signed up for in timely fashion
* change stuff so client is happy, but get him to not ask you to redo everything
* get client to pay you
* if maintenance define maintenance contract and send invoices while you keep track of bugs

you also probably want to set your own copany up so you can pay taxes and your clients get to declare their it costs

so you need project management skills, marketing skills, coding skills, basic sysadmin skills, accountant skills and basic law knowlege

deleting "var" of "var fsOn = -1 did break the whole thing.
i put the var before the function and deleted the first if statement. like this, fullscreen#start worked, but still fullscreen#finish didn't:
javascript: (var fsON = -1; function() {if (fsON==-1){$("button[data-action='fullscreen#start']").click();}else{$("button[data-action='fullscreen#finish']").click();}fsON = -1*fsON;$("button[title='fullscreentoggle']").click();})();

also the following didn't work:
javascript: (var fsON; function() {if (fsON==-1){$("button[data-action='fullscreen#start']").click();}else{$("button[data-action='fullscreen#finish']").click();}fsON = -1*fsON;$("button[title='fullscreentoggle']").click();})();

you mind correcting my code? maybe then i'll learn something.

Noted. Thanks for answering user

How to join multiple rooms in socket.io?
Or maybe should I use something different?

damned, 2nd example should be:
avascript: (var fsON; function() {if (fsON == null ){var fsON = -1; }if (fsON==-1){$("button[data-action='fullscreen#start']").click();}else{$("button[data-action='fullscreen#finish']").click();}fsON = -1*fsON;$("button[title='fullscreentoggle']").click();})();

To maintain you want to offer new features and bug fixing so set up some pricing standard and a ticketing system.

what's with your javascript: anyway?
are you putting this to a onclick attribute? if so, stop. don't do this. add the event after you dom has loaded instead of abusing attributes like that.

put this at the end of your page.
(function() {
var fsON = true;

var myEvent = function() {
var dataThing = fsON ? 'start' : 'stop';
$('button[data-action="fullscreen#' + dataThing + '"]').click();

$('button[title="fullscreentoggle"]').click();

fsON = !fsON;
}

myElement.addEventListener('click', myEvent);
})();

replace myElement and click with whatever element and event you want to do that.

you could modernize this by a lot, but I don't know what browser reuirements you have.

>create hexagon in javascript canvas
>use array input to a function to create the hex
>works fine
>do it again by putting the array in a variable
>completely breaks
why? nothing has changed except that the array is now a variable.

post the code.
magic glass ball not working.

i put the code in FF bookmarks which i can access with key shortcuts. so with alt-1 i can edit a textfield, form, table or whatever in our CMS, with alt-2 i can save it, with alt-4 i can make text a H4 etc. so the bookmark is not http: but javascript:
so my script should check the value of fsON and then either click the button[data-action="fullscreen#start"] or button[data-action="fullscreen#stop"].
no onclick attribute.
as you might expect, i know only little about js, but your code doesn't seem to fit my needs.

make a userscript for stuff like that instead of using bookmarks.

b-b-b-but i just want to make that script work!

still, userscript looks like an interesting thing, never heard of it.
thanks, also to

fine.
javascript:(function() {window.fsON = !(window.fsON ?? true);$("button[data-action='fullscreen#" + (fsON ? 'finish' : 'start') + "']").click();$("button[title='FullscreenToggle']").click();})();

third fsON should be window.fsON too, change it yourself.

meh i found the problem and commented out the single line of code that broke it...but i'm confused on why it was even breaking in the first place...it doesnt affect the array variable at all...even worse is that it will change the array even if it's a const which is mind boggling

it happens in both chrome and firefox too

oh also, ?? should be ||.
wrong language.

here's the full fixed thing
javascript:(function() {window.fsON = !(window.fsON || true);$("button[data-action='fullscreen#" + (window.fsON ? 'finish' : 'start') + "']").click();$("button[title='FullscreenToggle']").click();})();

What does Sup Forums think of senior friendly web design?

well fuck me, I forgot false would negate the initializer all the time anyway.
javascript:(function() {window.fsON = !(window.fsON == null ? true : window.fsON);$("button[data-action='fullscreen#" + (window.fsON ? 'finish' : 'start') + "']").click();$("button[title='FullscreenToggle']").click();})();

Learning HTML and CSS

When should I move on from this? What projects should I do? I don't want to sign up on a website to view anything, by the way.

It's a fucking nightmare to do something for the elderly/people who aren't used to computers.

I've followed a few usability tests on prototypes I've done and the logic computer illiterates use is so different to everyone else that designing a good UX for them means you're fucking the UX for the majority of your users.

>make awesome prototype
>everyone thinks it's awesome and super easy to use
>organize usability tests to see if there's something to improve before locking the specs and starting implementation
>everyone goes through the path without a single problem
>they praise the prototype
>then comes in the elderly test user
>can't get through any of the steps without help
>literally won't find the single button on the page to proceed
>tells that the prototype is shit
>mfw

awesome! it works!
still don't get exactly what the part with the windows property does, gonna have a closer look at it tomorrow.
thanks a lot!

Need help posted my question on stackoverflow,

stackoverflow.com/questions/43009883/making-a-post-to-mongo-database-using-redux-saga-redux-saga-mongodb

also anyone have any more docs or examples of using redux-saga with mongodb, in react?

why have i been sleeping on mongodb so long? tried it for the first time last night and just want to migrate all existing mysql stuff to mongo

Client: I need a report of [insert complex query with many relationships]. It should work fast.

mongo makes sense when you're pulling JSON data from an API, just throw it in mongodb and then retrieve whichever data you need.

the mongo drivers for the languages i've tried are god tier as well.

Many modern DB engines have support for JSON fields. Disk usage might be important too, based on the project.

Go do the freeCodeCamp projects.

>muh sign up

Shut up.

How can I practice using git if I only work by myself? I use it but I don't do any branching.

So how do I into backend guys? Everything seems to be frontend focused. Do I need to learn some frontend before diving into the backend?

Got any good resources? Videos, books, anything?

You should try following a tutorial that takes you to use cloud9 where those buttfuckers won't let you sign up for a FREE service without providing your credit card information (for identity purposes).

You don't even get to complain about email verifications anymore.

Start using it more? Whenever you start working on a new feature, branch, work, commit and merge when you're done. If you use a service that has built-in issue tracking then use that to keep track of stuff you know you want to add.

I learned using the git-scm tutorials and still refer to them a lot.

git-scm.com/book/en/v2/Getting-Started-About-Version-Control

Sup

I installed an SSL certificate for my site but it doesn't really work, it says "a part of this website is insecure". How can I fix it?

The site is placabit.net

There's probably a script or stylesheet which is not https. Check all your src's and href's.
Also check your site with ssl labs. If you fix the issues and make sure you're setting HSTS headers you should be able to score A+.

Its your counter plugin @
cerotec.net/contador.php?t=5&s=2&i=82706

I tried removing the counter and now the error is different, it says "certificate emitter unknown" or something like that. What should I do? D:

>a part of this website is insecure
That part of the website you.

what is unit testing and why do i need to know it....hows it any diff than just testing your app locally...

...

looks like only firefox is being autistic because the certificate is self-signed. It works fine in Chropera and that's good enough for me.

wat

hey so i'm looking to set up a local server to host files via lan. what's a good thing to use for this?

learn javascript too while you're at it

test all the small things in an automated way. make sure your functions do what you think they will.

those units are still passing...

didnt really answer my question straight forward but ok?

its fine. i mean the most important part of bootstrap is it's grid system.

Super dumb question, but Google results aren't paying off.

From the Chrome Developer Console, is there a way to "browse to" a function? i.e. if an element has an onclick handler of "myOnClickHandler", is there a way to quickly view "myOnClickHandler"?

I need some advice, I think I am unable to cope with professional web development, it's just the level of clients and the work that is so dumb and boring (quit a project because simpleXML wouldn't parse values in an XML attribute, so annoying) but webdev is the most popular and well paying job around my area, what do?

>function
When you inspect an element, on the right toolbar you should see the Styles, Computed, and Event Listeners tab...event listerners is what you want for events.

Hm... I see the Event Listeners, but it's kind of confusing in this case. Sorry, but I'm way over my head. I'm not a web dev, and I'm trying to scrape the Toyota Information Services website to download entire manual PDFs. :-)

In this particular case, there's a function called "expandTreeSection" which appears to take a URL as a parameter, but looking at the 'Sources' tab and doing a Ctrl-Alt-F search for expandTreeSection doesn't return any results.

I'm making very slow progress, though. Thanks for the help.

How valuable is knowing Ruby in 2017 ?
is it dying basically ?

Why the hell do people still use notepad++? All the other editors in this list are better than it.

Okay, no problem. Fortunately I have very few relations since I actually know how to use MongoDB, and for the cases where I do need to combine multiple documents and see poor read performance, I can denormalize my data to solve that problem.

How will you be paying?

Notepad++ is the lightest-weight option with syntax highlighting (I think), huge file support, and quick startup time (not VS-anything). Oh, and no skill (vim).

>vim for web dev
JUST

Develop in feature increments. Each feature is its own branch. Have a release branch you merge your features into. Your feature merges should always be one commit. You only merge when all your tests are passing on your feature branch.

These rules will get you to use almost all you need in git - branching, merging, rebasing.

This tutorial will teach you everything you need to know to work with git - learngitbranching.js.org

>visual studio/vim for webdev
I almost thought you were being serious. You got me.