DEV Community

chimichimi123
chimichimi123

Posted on

My experience in phase one

Ever since I was in high school I have always wanted to become a software engineer and now it's finally happening! I spent so much time working odd jobs trying to save enough money to be able to attend Flatiron School and kept constantly getting set back. I was beginning to lose hope in being able to attend Flatiron School, but thankfully my grandparents offered to help me finance the tuition through a loan and I'd only have to pay half so I was able to attend!!

When I was applying to Flatiron School I had already known that it was going to be very fast-paced and difficult and it has definitely lived up to my expectation in that regard, but I'm also amazed by how much I've learned in such a short time. Coming from a background of manual labor and just blue-collar work this has been a drastic change for me but I am so glad I made it, I love that feeling I get when all the tests finally pass or I finally figure out what the bug in my code was that had me stuck for hours, feeling myself getting more efficient and comfortable with things I once struggled with is such an accomplishing feeling.

A good example of something I once struggled with and am now so much more comfortable with would be understanding the DOM, the DOM (Document Object Model) is a programming interface for web documents and the backbone of web development. The DOM represents the hierarchical structure of an HTML document as a sort of tree of objects where each element in the document can be manipulated with Javascript

// Select the heading element using its id
const heading = document.getElementById('main-heading');

// Update the text content of the heading
heading.textContent = 'Welcome to my Website!';
Enter fullscreen mode Exit fullscreen mode

this little snippet of code is a great example of how we can edit the DOM using Javascript to change something, in this example we changed the text of the heading element to now say "Welcome to my website!"

The DOM can also be used for other things such as responding to user actions by using .addEventListener(). A good example of this would be the following code in which we add an event listener that changes the color of the heading when the user clicks.

// Add an event listener to the heading element
heading.addEventListener('click', () => {
    // Change the color of the heading
    heading.style.color = 'blue';
});
Enter fullscreen mode Exit fullscreen mode

This is something that I used to struggle a lot with, but now find it to be extremely easy and wonder how I ever did struggle with it, it's so much fun learning this and looking back at how much I now understand. Before attending this school honestly I didn't even know how to really read code, I'd occasionally open the dev tools in Google Chrome and just click stuff and maybe rewrite the name of something if I was really bored but it all looked indecipherable to me and being able to now more than just read the code actually be able to write my own and create my own webpages feels like such an accomplishment to me

Top comments (0)