Week 2 concludes having moved onto JavaScript in the boot camp and now having a set roadmap for topic areas to invest my time in beyond the technical learning. Over the remaining 14 weeks in this boot camp, I will be devoting two-week periods to each of the broad topic areas below.

• Web3
• Blockchains
• Smart Contracts
• Crypto
• NFTs
• DAOs

I will be looking to talk with hiring managers/recruiters and developers to learn more about the technologies and concepts those in the industry are looking for and what those looking to land a job in web3 should familiarize themselves with. The daily articles will also be focused on these topic areas while in each period (by the way, I'll be tweeting the TL;DR), the first of which starts tomorrow.

Technical Learning

I've made it to the point where uploading to my GitHub makes sense, so I'll start to show a history of coding practice and improvement via my repositories. You can see what I've learned and how I've applied this knowledge for assignments by looking at the Bootcamp repo. Here's what I learned (and correct me if I'm wrong);

CSS

Resets 

Used to zero out the margin and padding for the elements of a page. This is done to help ensure consistent design between browsers.

* {
    padding: 0;
    margin: 0;
}

Position

By default, the placement of items in HTML determines the order that they appear on the page. Position allows for changing this by attaching this property to its styling.

Absolute: sets the element to be a specific place on the screen and while scrolling it continues to stay there.

Relative: sets the element to be moved to a specific area relative to where it currently is.

Fixed: sets the element to be a specific place on the page and while scrolling it continues to stay there.

.someclass {
    position: absolute;
    position: relative;
    position: fixed;
}

Overflow

Allows you to have some control over how content is displayed when there is too much for the size of the element.

Auto: gives you the option to scroll through the items in the element (provided there is enough content that this is needed).

Hidden: the remaining content that does not fit is left invisible.

.someclass {
    overflow: auto;
    overflow: hidden;
}

display: grid;

This property further gives power over the layout and easy control of columns and rows.

.someclass {
    display: grid;
    grid-template: 60% 60% / 200 px;
}

JavaScript

Variables

These are defined and then used to store & modify information in scripts.

var count = 5;
var message = "Hello World";
var likesJS = true;

Operators

Just like regular old math operators.

A + B
A - B
A * B
A / B 

Data Types

Number: any actual number (3, 5, 67)

String: any characters  (A, any, Mike, Ask8)

Boolean: True/False

Functions

These are what make the code actually do something.

I used the following snippet for a button that changed its text from "Login" to "Logout" when clicked.

Adding "return" to a function returns the output of the function.

Adding "console.log" to a function will send the result to the console log, rather than the user.

function loginout() {
    document.getElementById('button-login').innerHTML = "Logout";
}

Alerts

This will send a pop-up to the user with some message you have left for them.

<button onclick="alert('hello')">Click Me!</button>

this

I learned it, but I'll be honest, still not sure what it is so "this" is going under the still trying to understand better section

<button onclick="example(this)">
    Click Me
</button>

Hover Events

This event activates when the mouse is hovering.

onmouseover: event activates while the mouse is over the area.

onmouseout: event activates when the mouse leaves an area.

function over(element) {
    alert("mouseover");    
}
    
function out(element) {
    alert("mouseout");    
}

QuesrySelector

Using selectors similar to how it's done with CSS, we can select an element by an id and alter it.

var cat = document.querySelector(".cat img");

Non-Technical Learning

This week I took off a lot from reading articles to focus on the technical knowledge. The biggest thing to report here is the road map for topic areas. 

Closing

That's my report on the growth from this last week. I'm particularly looking forward to upcoming discussions I will be having with others in the industry as I try to understand the broader systems, technologies, and concepts. Feel free to share any insights below and recommendations for who to talk to or what to read! 

Also, if you are still trying to learn about these topic areas, join me in Discord. I'm looking for first members to help me shape this knowledge community for people interested in these technologies and I have a lot of great ideas but it has to grow first!

You can also find me here:

LinkedIn | GitHub | Twitter |  My Website