Forem: Abdulsamod

Why I Want to Be a Front-end Developer and How HNG Will Help Me Achieve My Goals

Abdulsamod — Thu, 06 Feb 2025 14:39:00 +0000

In a world where technology is the standard, web applications and websites are a crucial part of the digital world. Creating interactive web applications with seamless user experiences is a passionate interest of mine, seeing how well-designed websites can enhance user engagement inspired me to learn HTML, CSS, and JavaScript. My background in software engineering has given me a solid foundation, but I want to specialize in front-end technologies to bring ideas to life with visually stunning interfaces and responsive design.

How HNG Will Help Me Grow in the Field

The HNG internship provides a structured learning environment where I can work on real-world projects, collaborate with experienced developers, network with fellow front-end developers and improve my problem-solving skills. Through mentorship, hands-on coding tasks, and exposure to industry best practices, I will gain practical experience that goes beyond theoretical learning. HNG also offers a platform to connect with potential employers and clients who might be needing to hire Web Developers, making it a stepping stone in my journey to becoming a professional front-end developer.

For instance, mastering modern front-end frameworks like React.js is crucial in today’s job market. Companies looking to build scalable and efficient web applications often hire React.js developers, and by learning from HNG’s structured program, I will be better equipped to meet industry demands.

My Goals for the Internship and How I Plan to Achieve Them

Master Front-End Technologies – I aim to deepen my knowledge of JavaScript and other frameworks and technologies like React.js, Next.js, and UI/UX design principles. I will achieve this by completing coding tasks, contributing to discussions, and seeking feedback from mentors and fellow interns.
Build a Strong Portfolio – A well-structured portfolio is essential for landing jobs. Throughout the internship, I will focus on developing projects that showcase my skills and help put me on the developers' scene.
Network with Industry Experts – HNG provides access to a community of experienced developers and recruiters. I plan to engage actively in discussions, ask questions, and build connections that could open doors to job opportunities.
Improve Problem-Solving Skills – Real-world coding tasks will help me refine my debugging and optimization skills, ensuring I write clean, efficient code.
Become Time Efficient – HNG's strict deadlines will help me get accustomed to working on a time limit, modelling real-world work environment.

By the end of this internship, I hope to be well-equipped with the skills necessary to take on front-end development roles confidently. Through dedicated learning and practical experience, I am excited about the journey ahead and grateful for the opportunity HNG provides.

100 days of Miva: Day 15

Abdulsamod — Tue, 03 Sep 2024 21:24:07 +0000

It's day 15 of the 100 days of Miva coding challenge which has flown by very quickly but has helped me improve massively in my HTML, CSS and JavaScript skills.
Today, I learned two concepts in JavaScript. Displaying object properties and JavaScript Events. They are very important in adding data and also keeping webpages responsive and interactive.

Displaying Object Properties

As i discussed previously, objects are used to create data blocks containing data of different data types related to each other or a particular subject; written in a key-value pair format.
Displaying these properties have different methods in which it can be achieved. Firstly, they can be displayed as strings where the properties are concantenated using the addition operator.

They can be displayed as a loop selecting each key and value pair until the object is exhausted.

They can also be displayed in an array format using the Object.values() method.

Finally, they can be displayed using the JSON.stringify() method which displays them using the JSON notation.

JavaScript Events
Events are actions that occur on a webpage due to the browser or user action or input. Actions such as a button clicked, a webpage loading, page sizing and so on are known as Events. JavaScript code can be used to cause certain reactions when these actions happen.

For example, on the click of a button, JavaScript code can be used to display the time and date in real time as compared to static display with HTML and CSS.

JavaScript code can also be used to change the content of a particular element when an action takes place on it.

Functions can also be called and executed in case of an event.

The concept of JavaScript Events is crucial to making webpages responsive and interactive as they can be used to induce real time reactions to actions on the webpages.

Day 15 was hugely productive and educative and I plan on exploring more on JavaScript Events tomorrow!😊

Source codes available here:
Object display: (https://github.com/Abdul-Samod/100daysofMiva/blob/74ad5573744c15d1955e8f8777053f0492d41fe9/javascript_prac2.html)

JavaScript Events: (https://github.com/Abdul-Samod/100daysofMiva/blob/74ad5573744c15d1955e8f8777053f0492d41fe9/javascript_prac3.html)

100 days of Miva: Day 9

Abdulsamod — Wed, 28 Aug 2024 22:47:56 +0000

Day 9 of the 100 days of Miva coding challenge. Big progress has been made on my understanding of JavaScript.

Today, I learned about functions on JavaScript. Functions are very useful in JavaScript as they allow us to reuse code and also avoid mistakes due to code duplication. Thanks to W3schools, I was able to learn and practice functions and operations related to them. Let's dive in!

Creating Functions
Functions are created by using the function keyword, followed by parenthesis containing the parameters required for executing the function. The return keyword is used to state which operation is to be performed on the parameter(s) and what value to return to the user.

Using Functions outputs as variable values
Outputs of functions can be assigned to variable names after the function has been executed.

Functions have various uses and can be used to perform different types of operations ranging from arithmetic operations, logical operations and executing conditional statements. Here is an example of a function used to convert units:

Values obtained from these operations can be embedded in HTML programs that require values obtained from these functions.

Local Variables
In JavaScript, variables declared within a function are known as local variables and do not exist outside of the function. Hence, a new variable can be declared with the same name outside of the function which is normally not allowed.

Functions are very important in JavaScript as they make coding easier and cleaner. They allow code reusability and serve as mini libraries where outputs can be pulled for use in other parts of code.

That's it on JavaScript Functions. Hoping to explore more and share with you in the coming days! Source code can be seen here: https://github.com/Abdul-Samod/100daysofMiva/blob/ce61cd46cefb40058a83276484d45b1b27c27a38/javascript_prac2.html

100 days of Miva: Day 7

Abdulsamod — Tue, 27 Aug 2024 00:46:29 +0000

It's day 7 of the 100 days of Miva coding challenge and I continued on my JavaScript learning journey, learning about other types of operators, data types and so much more.
JavaScript Operators
Last time, I begun exploring the different types of JavaScript operators and stopped on the arithmetic operators which allow us to perform various mathematical operations on variables of different data types.

Assignment Operators
Assignment operators are used to assign values to variables in JavaScript. After declaring variables with keywords like let, var,
const, assignment operators are needed to attach values to the variables. There are different types of assignment operators including the simple assignment operator (=), addition assignment operator (+=), subtraction assignment operator (-=), multiplication assignment operator (=), division assignment operator (/=), exponentiation assignment operator (*=) and so on.

JavaScript Data Types
Values assigned to variables can be of different types from numbers to texts to conditional statements. JavaScript has various data types like strings for texts, numbers for integers and decimals(float), Boolean for true or false values and lots more.

Arrays and Objects
Arrays are used to declare multiple values in one variable. It is written in square brackets and the values are separated by commas. Arrays also allow for different data types to be declared inside one single variable.
Arrays are zero-indexed, meaning values in array are counted from zero upwards.

Objects are used to encompass multiple variables into one single line or block of code. They are written in curly braces and unlike arrays, have the variable names paired with their respective values before being separated by a comma. Objects are also zero-indexed and count their values form zero upwards.

More Data Types will be explored on day 8 and also so much more on this exciting JavaScript journey!

https://github.com/Abdul-Samod/100daysofMiva

100 days of Miva: Day 4

Abdulsamod — Sat, 24 Aug 2024 09:32:02 +0000

It's day 4 of the 100 days of Miva coding challenge. I skipped day 3 report as I was stuck on my web design project and needed a change of pace. This is why I have decided to delve into JavaScript today.
JavaScript
JavaScript is like the behavioral component of a system and of a website. It adds interactivity and responsiveness to a website making it a crucial component in web design and development.

Getting Started
I turned to W3schools for learning as they have very straightforward tutorials and practice exercises. I then created an HTML file and wrote some basic text with the heading and paragraph tags.

JavaScript Variables
I then included a script tag to write my JavaScript inside of the HTML file. Then i started by declaring some variables and assigning values to them by using the _let _JavaScript keyword.

Then i used some JavaScript functions to change the content of the HTML content i wrote earlier. Also, i learned and practiced the scope of declaring variables with various keywords like var, let, and const.

Creating and modifying arrays
I created a simple array for a candidate's details using the _const _ keyword and capturing the different data types in curly braces. I also used various functions to modify and add values of different variables in the array.

Arithmetic Operators
Finally, i practiced using some JavaScript operators to assign and modify values of variables. I started with the arithmetic operators which are for basic mathematical operations. JavaScript statements containing operators are known as Expressions.

That was it for Day 4. I plan to explore more types of operators on Day 5 and more on JavaScript. The code files are available with this link:
100 days of Miva/GitHub

100 days of Miva

Abdulsamod — Thu, 22 Aug 2024 09:39:12 +0000

Day 2
Day 2 of the 100 days of Miva coding challenge had me continuing on my educational website project.

I finally was able to position the elements on the Home page, so it looks much better now.
I do not know how to apply Flexbox positioning yet so I had to use the position attribute and some margin and padding to get the image and the links in decent positions.

About Page
I then got started on the About page. I had a simple layout planned for it which includes just the history of the establishment, and the vision and mission statements.

Before that, I had brought over the header and navbar to avoid duplicating code. I plan on moving on to the footer and Contact page today.

Flexbox tryout
After the main work, I tried some Flexbox practice to try and learn it as it is a better and easier way to position elements on a webpage.

But, I ultimately could not get it to work. I plan on getting back to it today though and make it work one way or another.

Day 1: #100 days of Miva coding challenge

Abdulsamod — Tue, 20 Aug 2024 22:24:23 +0000

Starting the 100 days of Miva coding challenge is a big and exciting one for me as I get to work on projects to hone my skills.

Starting the challenge relatively late
The challenge started yesterday with many others beginning their code journeys already but better late than never it is for me🙂.

Getting Started
First thing I did is create a repository using Git and GitHub in order to save and track my work during this challenge. Although, I still have some challenges in pushing my work directly from the text editor to the repo, I managed to update the repo using the update method👍

Activities
Afterwards, I started learning by creating a simple form using HTML and CSS that can collect user input.
The form contains fields like the name, email address, password and a sign up button.

In order to make up for missing out on the first day, I got started on a project to develop a 3 page website for an educational institution containing the Homepage, Contact and About pages.
I made progress on the Home page by creating the navigation menu, then created a hero section with an image inserted all with plain HTML and CSS.

My major challenge so far has come during this part of the project as I battled with positioning contents on the webpage😭, some of which I successfully overcame.

Much work is to be done on the project and I aim to complete it during the journey of this challenge continuing on tomorrow. Link to my work is attached below. Thanks 😊

GitHub