|
1 | | -# Frontend Mentor - QR code component solution |
| 1 | +# QR code component solution | Frontend Mentor |
| 2 | + |
| 3 | +**Part 1** |
2 | 4 |
|
3 | 5 | This is a solution to the [QR code component challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/qr-code-component-iux_sIO_H). Frontend Mentor challenges help you improve your coding skills by building realistic projects. |
4 | 6 |
|
5 | | -## Table of contents |
| 7 | +--- |
| 8 | + |
| 9 | +## 📚 Table of contents |
| 10 | + |
| 11 | +- [🔎 Overview](#-overview) |
| 12 | + - [📸 Screenshot](#-screenshot) |
| 13 | + - [🔗 Links](#-links) |
| 14 | +- [🧠 My process](#-my-process) |
| 15 | + - [🛠️ Built with](#️-built-with) |
| 16 | + - [🎓 What I learned](#-what-i-learned) |
| 17 | + - [📈 Continued development](#-continued-development) |
| 18 | + - [🔜 Next Project](#-next-project) |
| 19 | + - [🗃️ Useful resources](#️-useful-resources) |
| 20 | +- [👤 Author](#-author) |
| 21 | + - [🌐 Connect with Me](#-connect-with-me) |
| 22 | + - [💻 Coding Profiles](#-coding-profiles) |
| 23 | + |
| 24 | +--- |
| 25 | + |
| 26 | +## 🔎 Overview |
| 27 | + |
| 28 | +### 📸 Screenshot |
| 29 | + |
| 30 | + |
| 31 | + |
| 32 | +### 🔗 Links |
| 33 | + |
| 34 | + - [🔴 Live Demo](https://github.com/DalaScript/qr-code-component) |
| 35 | + - [🗂️ GitHub Repository](https://DalaScript.github.io/qr-code-component/) |
| 36 | + |
| 37 | +--- |
6 | 38 |
|
7 | | -- [Overview](#overview) |
8 | | - - [Screenshot](#screenshot) |
9 | | - - [Links](#links) |
10 | | -- [My process](#my-process) |
11 | | - - [Built with](#built-with) |
12 | | - - [What I learned](#what-i-learned) |
13 | | - - [Continued development](#continued-development) |
14 | | - - [Useful resources](#useful-resources) |
15 | | -- [Author](#author) |
16 | | - - [Connect with Me](#Connect-with-Me) |
17 | | - - [Coding Profiles](#Coding-Profiles) |
| 39 | +## 🧠 My process |
18 | 40 |
|
19 | | -## Overview |
| 41 | +### 🛠️ Built with |
20 | 42 |
|
21 | | -### Screenshot |
| 43 | + - HTML5 |
| 44 | + - CSS3 |
| 45 | + - Flexbox |
| 46 | + - Mobile-first workflow |
| 47 | + - bem - [Block Element Modifier](https://getbem.com/introduction/) |
| 48 | + - scss - [Sassy Cascading Style Sheets](https://sass-lang.com/documentation/at-rules/control/for/) |
22 | 49 |
|
23 | | - |
| 50 | +### 🎓 What I learned |
24 | 51 |
|
25 | | -### Links |
| 52 | + - Actually, nothing special, It was pretty easy for me. |
26 | 53 |
|
27 | | -- [Solution URL](https://github.com/DalaScript/qr-code-component) |
28 | | -- [Live Site URL](https://DalaScript.github.io/qr-code-component/) |
| 54 | + > 🚀 For me, this challenge was more about **practice** and gaining additional **experience**, |
| 55 | + > rather than learning something entirely new. |
| 56 | + > |
| 57 | + > 👨💻 Since I’m not a beginner and already familiar with these technologies, |
| 58 | + > I approached it with confidence — and still, I truly **enjoyed working on it**. |
| 59 | + > |
| 60 | + > 🎯 Overall, I consider this a very **valuable and enjoyable experience**. |
29 | 61 |
|
30 | | -## My process |
| 62 | +### 📈 Continued development |
31 | 63 |
|
32 | | -### Built with |
| 64 | + - First I want to finish the javascript course I'm taking on freecodecamp, I'm also going through the learning path on Frontendmentor, and after that I want to focus more on React, Next.js and Node.js. |
33 | 65 |
|
34 | | -- Semantic HTML5 markup |
35 | | -- CSS custom properties |
36 | | -- Flexbox |
37 | | -- Mobile-first workflow |
38 | | -- bem - [Block Element Modifier](https://getbem.com/introduction/) |
39 | | -- scss - [Sassy Cascading Style Sheets](https://sass-lang.com/documentation/at-rules/control/for/) |
| 66 | +### 🔜 Next Project |
40 | 67 |
|
41 | | -### What I learned |
| 68 | + - Drag and Drop | *[Project 16/20]* → [View Repository](https://github.com/DalaScript/drag-and-drop) |
42 | 69 |
|
43 | | -Actually, nothing special, It was pretty easy for me. |
| 70 | +### 🗃️ Useful resources |
44 | 71 |
|
45 | | -### Continued development |
| 72 | + - [ChatGPT](https://chatgpt.com/) - He is my hero, if I need something fast, if I can't understand something, or if I can't find it on the internet, I always ask him. |
| 73 | + - [W3Schools](https://www.w3schools.com/) - This is my favorite documentation platform I've been using since I started programming, it's the best explained resource. |
| 74 | + - [YouTube](https://www.youtube.com/) - I'm always looking for news and listening to other developers, sharing their experiences so that I can see many different solutions to a problem. |
46 | 75 |
|
47 | | -First I want to finish the javascript course I'm taking on freecodecamp, I'm also going through the learning path on Frontendmentor, and after that I want to focus more on React, Next.js and Node.js. |
| 76 | +--- |
48 | 77 |
|
49 | | -### Useful resources |
| 78 | +## 👤 Author |
50 | 79 |
|
51 | | -- [ChatGPT](https://chatgpt.com/) - He is my hero, if I need something fast, if I can't understand something, or if I can't find it on the internet, I always ask him. |
52 | | -- [W3Schools](https://www.w3schools.com/) - This is my favorite documentation platform I've been using since I started programming, it's the best explained resource. |
53 | | -- [YouTube](https://www.youtube.com/) - I'm always looking for news and listening to other developers, sharing their experiences so that I can see many different solutions to a problem. |
| 80 | +### 🌐 Connect with Me |
54 | 81 |
|
55 | | -## Author |
56 | | - |
57 | | -### Connect with Me |
| 82 | + - [Instagram](https://www.instagram.com/DalaScript) |
| 83 | + - [YouTube](https://www.youtube.com/@DalaScript) |
58 | 84 |
|
59 | | -- [Instagram](https://www.instagram.com/DalaScript) |
60 | | -- [YouTube](https://www.youtube.com/@DalaScript) |
61 | | -- [TikTok](https://www.tiktok.com/@CodeWithDala) |
| 85 | +### 💻 Coding Profiles |
62 | 86 |
|
63 | | -### Coding Profiles |
| 87 | + - [freeCodeCamp](https://www.freecodecamp.org/DalaScript) |
| 88 | + - [FrontendMentor](https://www.frontendmentor.io/profile/DalaScript) |
| 89 | + - [GitHub](https://github.com/DalaScript) |
64 | 90 |
|
65 | | -- [freeCodeCamp](https://www.freecodecamp.org/DalaScript) |
66 | | -- [FrontendMentor](https://www.frontendmentor.io/profile/DalaScript) |
67 | | -- [GitHub](https://github.com/DalaScript) |
| 91 | +*🙌 Thanks for checking out my project! More coming soon. Stay tuned 🚀* |
0 commit comments