Skip to content

Jakelliott98/Frontend-Mentor-Social-links-profile

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Frontend Mentor Social links profile

This project is a Frontend Mentor challenge that focuses on basic HTML and CSS. It's a simple beginner-friendly project designed to improve coding skills and practice essential web design concepts.

Why I created this project?

This is the first challenge from Frontend Mentor that I have completed, marking the beginning of my journey to build confidence in writing and publishing code. By working on this project, I had the opportunity to:

  • Share and compare my work and approach with others in the frontend mentor community.
  • Learn from alternative solutions and methods for completing similar results.
  • Familiarise myself with the process of completing Frontend Mentor challenges.
  • Practice and reinforce basic CSS concepts in a hands-on project.

What was my motivation for developing this project?

My main motivation for developing this project was to continue practicing and improving my web design skills. Although this is a small project, it highlights fundamental principles such as:

  • Spacing elements effectively relevant to eachother.
  • Colour contrast for better visual hierachy.
  • Practicing tools such as flexbox and states such as hover and focus.
  • Using images withing designs.

As I continue to create more complex projects these tools will be handy. Contining to achieve these smaller projects and comparing my code should hopefully help me to take on larger challenges down the line.

what have I learned?

The main things I learnt from this project were:

  1. Writing a README file. This is the first time I have written a README file for a project so practicing markdown and structuring this file.
  2. CSS concepts I gained more confidence with
    • Working on design elements like padding, margins and spacing.
    • Using the :focus pseudo-class, which I hadn’t explored much before.
    • a
  3. Practical design thinking Comparing my work from a beginner coder to other examples on the frontend community to see how others handled this challenge to see if there is more concise code I could or written or cleaned up my code in areas.

What languages did I use?

  • HTML: Structuring the content of the page.
  • CSS: Designing the layout, creating buttons, and styling them across different states.

Future plans:

I am currently completing a fullstack developer course on Codecademy and I am further along my journey than this project would suggest. However, the plan is to continue to complete frontend mentor projects to really touch up my design side of things. Then continueing my course and implementing more Javascript moving forward.

About

Frontend mentor challenge which is looking at basic HTML and CSS.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors