Jump to content
Sign in to follow this  
zakero

What is the best way to learn Javascript?

Recommended Posts

Hello guys.

It has been one and a half month since I started learning to code. I started off with HTML and then CSS. Learnt the basics and now I have the confidence that I can design a website. Then I started learning Javascript two weeks back and I'm finding it difficult as there are a lot of things to remember. My only source has been from W3Schools. I completed the first section of the tutorial by going through each and every "Try it Yourself" and understanding what has been done, also practiced them in "Try it Yourself" but I am unable to keep those in mind later as there are a lot of things to remember. So I'm asking the community, what is the best way to learn Javascript? Is it too early for me to learn Javascript? Should I move on to something else? What are the things I should emphasize more on in Javascript if I continue? Are there any basic projects I can work on to practice Javascript?

You valuable suggestions would be highly appreciated.

Thanks in advance.

Share this post


Link to post
Share on other sites

In my opinion, in order to be able to be good in JavaScript  we need to practice a lot And use of various resources, such as educational videos and internship courses

 

Share this post


Link to post
Share on other sites

I guess it comes down to, keep using JavaScript.

In my opinion, in a website sense, learn about how JavaScript can change the page of a website.
Styles, Content, Animation.

If you can figure out those out, that's all I've really needed to use JavaScript for.
You sound quite comfortable with your CSS and HTML, JavaScript can augment what's already there.

My favourite use of JavaScript is to create small windows of either confirmation, or data-entry fields for people to either expand, pop-up or reveal.

 

Here's a cool exercise. Can you create a text input field, that can do the following. (You'll be able to flex your HTML, CSS and JS muscles with this)

  • Has a search icon as its background
  • Hides said search icon when there is either text inside, or when the text box is focused
  • Increase the font-size (A little) and height of the the text box over a small duration (<1 second).
  • (Extra) Perhaps as you type, create a small 'autocomplete' section to choose from. (You'll obviously need to think of a few things that could go in here. Fruit is an example)

Share this post


Link to post
Share on other sites
On 3/7/2019 at 4:13 PM, Alidabirirad said:

In my opinion, in order to be able to be good in JavaScript  we need to practice a lot And use of various resources, such as educational videos and internship courses

 

Thank you so much. I guess I'll keep on watching Youtube videos about live projects and how others play around with Javascript.

 

12 hours ago, Funce said:

I guess it comes down to, keep using JavaScript.

In my opinion, in a website sense, learn about how JavaScript can change the page of a website.
Styles, Content, Animation.

If you can figure out those out, that's all I've really needed to use JavaScript for.
You sound quite comfortable with your CSS and HTML, JavaScript can augment what's already there.

My favourite use of JavaScript is to create small windows of either confirmation, or data-entry fields for people to either expand, pop-up or reveal.

 

Here's a cool exercise. Can you create a text input field, that can do the following. (You'll be able to flex your HTML, CSS and JS muscles with this) 

  • Has a search icon as its background
  • Hides said search icon when there is either text inside, or when the text box is focused
  • Increase the font-size (A little) and height of the the text box over a small duration (<1 second).
  • (Extra) Perhaps as you type, create a small 'autocomplete' section to choose from. (You'll obviously need to think of a few things that could go in here. Fruit is an example) 

Thanks for your detailed explanation. I am yet to figure out how Javascript can be used in a website. All I have been seeing in W3Schools till now is how the codes work. I'll start watching more videos on Javascript being used in a website.

Regarding the exercise you have mentioned, the first two bulletpoints are all about HTML and CSS which I am able to do. The third one is about CSS as well but I am thinking it has a little bit of Javascript in it, does it? The last one I am totally unaware of. But is there any kind of website where these kind of small real life usage of Javascript codes can be found? The codes in most websites are too complicated to understand for a noob like me.

Thanks both of you for your time.

Share this post


Link to post
Share on other sites

Play with JavaScript basic syntax like alert("You're welcome") and other related JavaScript inbuilt functions that we get things done without having to know what is happening behind. Now look for a good tutorial on Document Object Model(DOM). Having good knowledge of DOM will let you know how JavaScript  relates with HTML and CSS.

You should learn about HTML tree and understand what each element of an HTML indicates e.g parent, siblings, child etc Also learn about CSS ID and class. JavaScript uses css id , css class and HTML node terms like parent, child, siblings etc to manipulate HTML contents. This is the concept of DOM

Share this post


Link to post
Share on other sites

If you've completed the JavaScript tutorial, you'll want to check out the JavaScript DOM tutorial, for how you can apply the processing you've learned to a website.

Personally, I have a bone to pick with video tutorials. They're really good at teaching you how to make a particular thing. But they're terrible for attempting to combine features together. I find they're really useful when you have the programming knowledge to be able to think through the combination easily. They, by nature, provide a very easy fix for a problem, no thinking required.

 

Those bullet points go from no JS, (search icon in background) to a little JS (the ones inbetween), to JS maximum (autocomplete).

If you complete the DOM tutorial, it should be... relatively simple.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...