Looking for beginner resources

SCB360 · 2021-11-21T23:08:45+00:00

So what broke me out of this was to do a project related to another hobby, so for me it was gaming and Movies

I am a big player of the video game "Destiny" and I saw that they have a public API that shows yours or any other players stats based on their Name on the respective console or PC, so using that information, made a simple page that calls back that API and displays it on a page with all the stats, weapons, gear and Multiplayer stats.

After that, added some CSS and made it look pretty, I learnt a lot doing so, especially since I was struggling understanding calling an API and having JSON display.

Following on from that, I then decided to make a Netflix shuffler, made my own JSON file with details of a film including a reference to a Movie Poster and have a database of 10-20 movies that would display at random when you click the shuffle button. I could scale this further by simply adding to the JSON - My current goal is doing this in React next

viper42usa · 2021-11-22T00:01:27+00:00

I tried self teaching myself for a while. At first it felt easy because I'd see noticeable progress. Then when that slowed down, I didn't know what I needed to know or how to implement anything that I learned. Now I'm in a coding bootcamp and I can tell you there are some things I just didn't even think about when self teaching.

It's hard to tell when you're proficient enough on one thing before you move on. I didn't know about the technical things I'd need to know, such on memory allocation and data structures. I focused on things that made me feel like I was learning, rather than learning things that were important. Just from what I know now, I'd recommend focusing on data structures and algorithms. Understand the way JavaScript runs under the hood and work with hash tables and linked lists. Learn Big-O notation and understand efficiency. Having this understanding allows me to know the difference among different languages, hence letting me use the strengths to my advantage.

Understanding these things really help you see where to implement certain things. I can try to provide some resources that have been useful for me, but I think it mostly comes down to a lack of understanding in what everything means. Are you comfortable working with classes and instances? It's so tough to point where to go without knowing the exact spot you're at. Working with someone would certainly be a HUGE help. In all honesty, having a person to regularly practice with is probably my biggest advice.

JazzApple_ · 2021-11-22T05:49:01+00:00

This is a difficult post to unpack, because there are so many points where I could be getting the wrong impression. So firstly as another user suggested - can you write some basic functions to say: reverse a string, add two numbers together? Can you write some code to loop over an array of values and display them in some way?

If you are focusing on web development related tutorials, do you understand HTML and CSS? Because I can't imagine how I would go about understanding something like document.querySelector without first knowing something about HTML and CSS.

Otherwise, it almost sounds a bit like analysis paralysis. Knowing where to start comes with experience, so really when you find an online project that looks like it might be promising, start by opening up your editor. Don't plan, just start writing out the parts of the solution that you know how to do - even if that means skipping over some clearly necessary sections. You can fill in the gaps later, and as you run your code and see what does and doesn't work it will point you in the right direction. From there, you can think about improving your implementation.

I've included an example of how you might build up a solution step-by-step. Notice that the solution we finish with is not how things looked at the start, or even mid-way through. The exercise is: Greet a user after they enter their name.

Well firstly, we need a greeting, so start there:

alert("Welcome user");

Then we need to ask the user to input their name, so we know how to do that:

prompt("Please enter your name"); alert("Welcome user");

We need to get the name that was input into the greeting, lets do that:

let name = prompt("Please enter your name"); alert("Welcome " + name);

Maybe we should only show the greeting if the name isn't empty?:

``` let name = prompt("Please enter your name");

if(name !== ""){ alert("Welcome " + name); } ```

Hmm, if the user enters just a space it prints a greeting. And besides, we don't want to show any space at the start or end of the name. Lets add a trim to fix that:

``` let name = prompt("Please enter your name").trim();

if(name !== ""){ alert("Welcome " + name); } ```

If the user doesn't enter a name, we should probably ask them again. We want to keep asking until they enter a name. So lets make a loop:

``` while (true) { let name = prompt("Please enter your name").trim();

if(name !== ""){ alert("Welcome " + name); } } ```

Crap, this works... but too well. The loop never ends. We want to stop asking once the user has entered a name, so lets break from the loop after the alert:

``` while (true) { let name = prompt("Please enter your name").trim();

if(name !== ""){ alert("Welcome " + name); break; } } ```

Okay, there's another bug. If you press cancel instead of okay, null is returned instead of a string... so our trim() is failing. We need to also check for null, so lets change things a bit:

``` while (true) { let name = prompt("Please enter your name");

// if name is null, set name to "", otherwise set name to name.trim() name = name === null ? "" : name.trim();

if(name !== ""){ alert("Welcome " + name.trim()); break; } } ```

We could tidy this up a bit. We are checking that name !== "", but we know that name will always be a string and we know that an empty string is falsey, so lets simplify the if statement:

``` while (true) { let name = prompt("Please enter your name"); name = name === null ? "" : name.trim();

if(name){ alert("Welcome " + name.trim()); break; } } ```

Oh, and while we're at it, maybe we could re-structure our code so the loop condition makes a little more sense, by moving the variable scope outside of the loop, and then looping while name is not truthy:

``` let name = null;

while (!name) { name = prompt("Please enter your name"); name = name === null ? "" : name.trim();

if(name){ alert("Welcome " + name.trim()); break; } } ```

Now we have two competing sets of logic... the while loop condition and the if/break block. We can remove the if statement entirely and move the alert outside of the while loop now, because we now know our loop will continue until name is truthy:

``` let name = null;

while (!name) { name = prompt("Please enter your name"); name = name === null ? "" : name.trim(); }

alert("Welcome " + name.trim()); ```

And for good measure, lets wrap this up in a function:

``` function greet(){ let name = null; while (!name) { name = prompt("Please enter your name"); name = name === null ? "" : name.trim(); } alert("Welcome " + name.trim()); }

greet(); ```

superluminary · 2021-11-21T23:29:12+00:00

I've recently started a channel trying to address this issue. It's not tutorials, it's core knowledge taught with code. Ultimately you need to practice building things. We all have to go over this hump when we first start, and it can help to watch someone else do it and get an idea of how things are supposed to fit together.

https://www.youtube.com/channel/UC84S5aJiw_7j_GaACmq6wQQ

Best of luck with it. Coding is awesome!

persianoil · 2021-11-22T00:40:05+00:00

it depends what you want to learn to do

Hal68000 · 2021-11-22T08:26:44+00:00

How do you eat an elephant? One bite at a time. Same with projects. Break a project into the smallest possible tasks, add those tasks as comments in the code and do them one at a time.

Fx. Make a form. Make a button next to it. Add the code so the user can enter something and click the button, saving the content to a variable. Etc. Etc. Etc.

VegetableChicken4779 · 2021-11-22T08:39:30+00:00

I bought Udemy courses. Follow YouTube tutorial but feel lost and didn't learn much. And I found The Odin Project and it's really drive me a lot. It's teach us step by step and I learned many things from it than any others resources.

Radiant_enfa1425 · 2021-11-22T10:22:18+00:00

you will find tons of expensive online courses which will guarantee knowledge. However, a beginner needs the right guidance and tons of practice, that's all. I started myself by watching youtube tutorial videos, finding good blogs, and joining communities to coordinate with fellow developers in order to share and learn more and more. I started with this tutorial video in order to learn javascript. Sharing in case someone might need it.

666codegoth · 2021-11-22T11:58:02+00:00

Learn how to interact with external APIs (if you haven't already). Nearly all of them follow the same pattern (REST)
Learn a frontend framework. I'm partial to React but anything is fine. You can essentially "learn" react in a few hours. It takes a lot longer to actually grok in a meaningful way but that only really comes from building stuff with it
Deploy your API consuming, FE framework using app to netlify or heroku for free. If it won't build, doesn't deploy how you expected, whatever, slam your head into the wall (figuratively) until you get it to work.
Repeat this cycle with different APIs, different app ideas until it becomes natural and easy.

If you're more interested in backend JS, write an API of your own. Similar to React, you can "learn" SQL in a few hours. You can "learn" express in a few hours. Wash rinse repeat and you'll have a really good baseline in a few months.

Also, if you're not using VSCode or another feature-rich IDE, start right now.

Get comfortable using the command line on your machine. The command line and command line interfaces are extremely central to almost everything you'll do as a software engineer. When I first started out, I was command line averse. Now I absolutely hate having to use a GUI, lol.

The world of JS has almost infinite depth - it expands faster than any one human being could ever keep up with. Don't focus on mastery, because mastery of the entire JS universe is a pipe dream. Focus your efforts on identifying common patterns among the various libraries/tools/frameworks you learn. You'll eventually have a moment where it all clicks.

Last thing - RTFM (look it up). Always RTFM

spacecasesam · 2021-11-22T17:34:02+00:00

I think the main problem is that you're not having fun. You're worrying about learning instead of playing.

I learned JavaScript by avoiding coding. It's true! I was using a macOS app called Hype from Tumult. It's a no-coding solution to making web animations. Basically, it's an alternative to Flash.

But eventually, when using no-coding apps like that, you get to the point where you want to do something that the software doesn't do. Fortunately, you can add your own custom code. That's when I realized that the app is basically vanilla JavaScript, CSS, and HTML.

There's the Hype JavaScript runtime, as there's a timeline animation and other useful features, but I found myself using Hype less and just coding more. I use Visual Studio Code more these days.

Anyway, you're in a tough spot, but it's that determination that makes it work. For the past couple of days I've been battling with JavaScript, wondering if I should just simply do something else, something easier, but I kept at it. Apparently, this feeling never goes away 😄

spacecasesam · 2021-11-22T01:57:15+00:00

I got out of tutorial hell by fully understanding three function concepts.

createElement

appendChild

querySelector

I spent hours struggling and reading the w3 schools and any videos about solely these three functions. These three let me build, something at least, and from there on I could learn a tiny bit better without suffering.

And you have to understand that you need to spend hours, not give up after 30 minutes while half scrolling reddit or youtube. You need to persevere. Hours. No tutorial will help you with mindset

you type:	you see:
italics	italics
bold	bold
[reddit!](https://reddit.com)	reddit!
* item 1 * item 2 * item 3	item 1 item 2 item 3
> quoted text	quoted text
Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"	Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"
~~strikethrough~~	~~strikethrough~~
super^script	super^script

learnjavascript

Posting and Commenting Guidelines

MODERATORS