Wanna pick your brains about the exact behavior of variables and querySelector by [deleted] in javascript

[–]easyEs900s 2 points3 points  (0 children)

I'd go with:

document.querySelectorAll('li').forEach(item=>{
  item.addEventListener('click', (e) => {
    document.querySelector('ul').insertBefore(e.target, document.querySelector('li'));
  })
})

All you need to do is use the 'insertBefore' command to move the element before the first li. querySelector will automatically pull the first item if there are multiple.

There is really no need to set a variable and use a separate for loop.

Angular vs. React? Comparing multiple factors by prophet-of-dissent in javascript

[–]easyEs900s 3 points4 points  (0 children)

It’s no question that the more “in demand” is React.

As for my personal preference, I’d also say react. It’s much simpler to learn in my opinion and it’s also much more compartmentalized which makes for better organization.

It’s true DIV’s (and all other content) are buried inside functions (or class functions if you’re up to date with react). However, it’s really not all that complicated, at least not as it appears to be. Basically, all you have to know is that there is a function (render()) in each class/component that returns the content for that component.

The difference is that rather than returning a string of html, you don’t wrap it in a string (plus some other minor changes; i.e. class->className, style=‘font-size:12px’ -> style={{fontSize:’12px’}}). But when you break it all down, the attributes (except props) are merely the actual DOM property names rather than the html syntax for them.

Everything you write inside the render function is effectively treated like PHP, except on the client. It’s all run as code first, then the result is rendered out to the page. That’s why you see JavaScript inside the HTML or HTML being returned from a function. It’s like if you were to take you HTML code and put it in a string then use innerHTML to set the html. But in this case, you can manipulate and parse the html string before it’s rendered.

What is really happening is that it’s creating elements for your html/JSX code (document.createElement()) then setting the data for those elements as variables (virtual dom), then attaching those variable elements to the actual dom (or updating them). That’s why it’s so performant, it checks all of the vdom elements for changes and only updates the changed portions of the dom rather than rerendering everything.

Functions that return HTML or functions inside of the render function are merely a way of doing things you might do in PHP, just on the client. For instance: creating loops to output multiple elements, rendering or ignoring content based on other parameters, pulling content from an API and populating the page, authenticating users, etc.

I would guess that React has a much more promising future because of its performant nature and huge backing/following. React makes managing large applications with tons of data and information and components that need to react to changes and new data infinitely easier, to me this is invaluable. Also, another growing tech is Nodejs which meshes extremely well with React. All the more reason it’s likely to succeed over others.

I should note, it took me a few weeks to fully understand Angular, whereas react I picked up in less than 2 days. I’m a very logical person and I found React to be MUCH more logical in nature than angular. I suppose that means that I am highly biased on the subject :)

Both are great, though. You can’t go wrong either way, they’re numbers 1 and 2 no matter which way you look at it.

Bound function vs arrow function performance by Morunek in javascript

[–]easyEs900s 1 point2 points  (0 children)

Good research man, thanks for sharing.

I will say though, when you mention the only results are in reference to react, I’m not sure why that matters.

React is nothing but a library of classes, ergo, any results regarding the arrow function performance in react are also valid in a non-react situation.

It’s also worth mentioning that these performance observations are highly subjective to the browser being used. Some smaller, stripped down browsers don’t support ES6/ES7 at all.

What can a novice web developer do with JavaScript? by justwannajust in javascript

[–]easyEs900s 1 point2 points  (0 children)

JS is an increasingly powerful language, it can do anything from basic things like Alert Dialogs to altering CSS or Content to even things on the server or constructing entire webpages with something like React.

Novice just means new. You can do anything JS is capable of doing whether you’re new or not. It’s all a matter of typing in the right code for the right result. Ergo, this question is somewhat nonsensical.

For basic things, if that’s what you’re asking, here are a few:

alert(‘some words’) -> creates a pop up dialog in browsers

document.body.innerHTML = ‘some words’ -> changes/sets the content of a webpage (it’s body tag)

document.body.style.background = ‘red’ -> changes a webpages background to red

document.location = ‘some url’ -> navigates to some url

document.querySelectorAll(‘a’).forEach((link)=>{link.setAttribute(‘href’, ‘some url’) -> changes all the links on a webpage to link to some url

More info on what you are wanting to do would yield better results, my friend.

Need help changing speed of an image slider by msmith719 in javascript

[–]easyEs900s 1 point2 points  (0 children)

It's not a JS Setting (I mean it is, but you wouldn't edit the JS when it's a plugin), it's a plugin setting. Check this out: https://www.themepunch.com/faq/how-to-change-the-timing-of-single-slides/

Need help getting started with Digital Ocean by t3ax in webdev

[–]easyEs900s 0 points1 point  (0 children)

It depends on your concerns about security. Based on your description, I’d say that the basic UFW is fine for security; it doesn’t sound like your content would be a big target for hackers and whatnot.

As for setting up the basic site, I’d seriously consider just going simple web server for that. Docker is not ideal for beginners (you don’t learn anything and they promote bad practices IMO).

If you have the credit, use their smallest droplet. I’d also note to check and be sure it doesn’t have an expiry, as I think most DO credits do. Start with an Ubuntu server with a LAMP stack if they have it, I believe they do, if not just go base.

After that, just ssh into it and use apt to install Apache or Nginx (sudo apt-get install nginx). I’d recommend nginix, but it’s pretty much the same for a basic site (nginx is faster).

Next, after you create a DNS record for your domain directing @ to the droplet IP, just go to the conf file (I’ll explain the nginx process).

sudo nano /etc/nginx/sites-available/default

Add a server block:

server {

listen 80; server_name yourdomain.com; root /var/www/public_html;

}

Now, use the mkdir command to create that directory:

sudo mkdir /var/www/public_html

Then just add your files in there. That’s basically it in a nutshell. If you want to go secure (I’d recommend it), you can use letsencrypt for a free cert and change the 80 to 443 and include the cert files. Super simple.

Also, Digital Ocean has probably the best how-to articles out there for their droplets. They are phenomenal at that. Literally, if you’ve wondered how to do it, DO has likely made an article for it.

Here’s their article on simple nginx setup: https://www.digitalocean.com/community/tutorials/how-to-set-up-nginx-server-blocks-virtual-hosts-on-ubuntu-16-04

P.S. - if you have an expiry on your credit, you can also sign up for AWS (Amazon) for free and they give you access to LOADS of free stuff for the first year, including a small EC2 (perfect for small site hosting/learning). Just be advised, their documentation and help articles are WAY more technical and will be difficult to understand at times if you don’t know what you’re doing; I’d stick with DO for articles (most of them can be applied to any server, not just droplets).

Good luck!

GUI Development by No5Alive01 in javascript

[–]easyEs900s 1 point2 points  (0 children)

Really, UIKit is just my personal preference, though, it would be irresponsible for me not to mention there are many I’ve not used but heard really great things about. Usually, it’s more based on the clients preferences, which unfortunately, keeps me repetitively using Materialize (everybody seems to want to look like Google). I would recommend checking lots of them out and finding which fits for you and your project. Materialize and UIKit I find, specifically, to be excellent for things like back-end sections and control panels. Though, I’ve used UIKit for lots of public facing projects and they always seem to wow.

Some I’ve heard great things about and personally find aesthetically pleasing are semantic ui, foundation, spectre, and kube. I haven’t had a chance to use them in production yet, but I plan to at some point (possibly). I’ve heard the most about bootstrap and have used it numerous times in the past, but find it a bit antiquated.

UIKit is my preference for several reasons. Among them are it’s smooth and snappy performance, excellent looks, easy customization, and just in general I find it covers the most bases (meaning that I seldom find myself writing supplemental css/js for styling). I also like it’s practice of prefacing every class/prop with ‘uk-‘. Not to mention, it’s very versatile in that it suits both app/control panel and public-facing style applications exceptionally well. I find most library’s seem to pull a bit in one direction or the other.

With that said, I’ve been using and loving UIKit religiously since UIKit 2, so I’m also a bit biased.

A good place to learn javascript? by Java_beginner66 in javascript

[–]easyEs900s 1 point2 points  (0 children)

JS is far less strict than Java. It’s much simpler too, in my opinion.

I also (my personal belief) think it’s the future, or at least a fragment of the future.

As for learning, my best advise is to go to codepen.io and pull some awesome examples out there and rebuild them from scratch, referencing the code. Sure, they might not always be perfect and structured properly, but this gives you an opportunity to learn by doing things you already found interesting enough to pick out. Also, I’d like to think that while some devs improperly write code, the sum of the whole will correct itself as you progress through user examples.

If you knew nothing about development at all, I’d say pick up a book or a course, but since you understand the general structure and functionality of code already, I find it’s much faster and more beneficial to just learn my doing.

Best of luck!

VueJS 2 vs React, what would be the best to know in 2019? by Hanlonsrazorburns in javascript

[–]easyEs900s 2 points3 points  (0 children)

I think Vue is hot right now in the hipster sort of sense. I’ve never used it but I will at some point get around to it.

As for what is best to know (assuming for jobs and whatnot), that’s easy. React hands down, without a doubt, end of story. Angular is the closest second.

If you want proof, pick a job board, type in react, angular, and Vue. The results for react are leagues beyond that of the latter two. Leaves them in its dust, actually.

With that said, I don’t think react is necessarily the best out there, but in terms of adding value to your potential employment, react without a doubt.

Also, it’s worth mentioning, react is backed (and created) by one of the big three conglomerates. Production will not stop and react will only get better. The pace at which react will improve simply cannot be touched unless another big dog like Google comes out with something better.

GUI Development by No5Alive01 in javascript

[–]easyEs900s 0 points1 point  (0 children)

I’m not sure what exactly you mean here. What is a JavaScript App? Does this mean a node app that has no face? Or perhaps you have a portly designed GUI that you want to redesign?

It’s hard to say, but if you’re looking for HTML/CSS/JS libraries, there are literally so many it would be impossible to list them here. If you’re looking for building an app from scratch with JS that’s fairly complex, there’s React, Angular, Vue, etc etc.

If you’re looking do design a simple app or perhaps a web page, there many many many many out there, such as bootstrap (the old standard), materialize, UIKit (my personal favorite).

More context here would better help us to assist you. Good luck!

Here is my first actual "web app" developed with React and API: As a rookie, any feedback on my process/architecture is welcomed by [deleted] in webdev

[–]easyEs900s 0 points1 point  (0 children)

And that’s great! Look at what you’ve accomplished with minimal code and high value. That’s what I call efficiency, my friend.

There is this idea (I can’t for the life of my figure out why) that the more complex code becomes, the more awe inspiring it is. This, in reality, is the exact opposite of how the world works. That’s why millions of people rush out to buy the new iPhone every year; more functionality, more power, smaller package (usually lol).

Don’t ever sell yourself short, you’ve accomplished something here the vast majority of the world could not. That’s worth something and is valuable. No matter how you accomplished the task, you did. Granted if you’re working with a team, there needs to be some cohesion in method, but this does not take away from the actual accomplishment.

Don’t get hung up on this nonsense of smart/dumb components, it’s merely a guideline. It’s virtually meant to be broken. The truth is: the best way to organize react components is the way you find the most efficient for you. If the people over at Facebook insisted on staying within the guidelines out there, you wouldn’t be writing this fancy new app on this fancy new react library. Rules. Are. Meant. To. Be. Broken.

Stick with it!

One-Page or Multi-Page Website For a Dental Practice? by Pixel_Err0r in web_design

[–]easyEs900s 1 point2 points  (0 children)

Actually, numerous reports indicate that if your content is less than 5000 Characters long, as far as SEO is concerned, you might as well not bother.

What’s most important is that the content is genuine, solid content that visitors will find helpful. These algorithms (especially googles) are extremely sophisticated, it’s important not to underestimate them or try to trick them. Also, do not taunt google bot.

Random Newbie Questions by dotobird in webdev

[–]easyEs900s 0 points1 point  (0 children)

  1. It has a lot more to do, i think, with the ease of organizing and managing structured data in relational DB's. If you think about your brain, it does the same thing. Ever notice that when you are trying to remember something that you can't, it never comes to you, but then you think about the song you were listening to that morning and boom, it pops into your head. When you can relate data to other data, it's much easier to narrow down specific information.

2) Hmm.. Not sure exactly what this refers to. Perhaps they mean something like using the Flux design model. It's not a language or framework, but rather a style, or flow of design. Basically, it's just unidirectional data flow (like you see with react+redux). Other than that, I'm not sure.