All solutions

It's really fun to build this project!!

The major learning in this project is Vue Router. I not only know how to use router to navigate a declarative location but I understand how to use router's instance methods which can programmatically link to nested routes.

I also tried to build a loader to make UX go smoothly.

Hope you enjoy it!

Happy Coding☺️

Hello FM friends, I am proudly sharing my job--listing-filtering project. This is the first time I built a project with Tailwind CSS, and I am also learning Vue at the moment.

Please feel free to leave any comments or emojis 😃 to say hi to me!!

Happy Coding 🤓

I took 4 hours to complete this responsive homepage and to recap what I've learnt so far.

In this challenge,

• I created an object in JS to contain information for slides, and I believe this makes my code look cleaner.
• I also use <li></li> to create an indicator for image slide which is better user experience.

I hope you enjoy building code as I do, and I am always welcome any suggestions and collab opportunities.

Happy coding!☺️

This is my first page integrating with other page via API.

In this challenge I attempt to write clean code and build an interactive landing page. For example,

• I tried to create objects and building prototype chain in them.
• I used ScrollReveal, a cool library with MIT License.

Thank you for checking this, and I open to any suggestion. Many love to this community.

In the challenge, I've learnt how to create an open-up menu with the background scrollbar disabled.

And I found it is useful and crucial to analyse the layouts for BOTH big screen and small screen before I write HTML, because this will impact which css attributes I want to use to display the design.

This practice is great! BIG THANKS for the community, and I'm always open to any suggestions.

This is the 5 months since I started my career and I am planning to apply my first (paid/unpaid) front end dev job;)

What do I learn from this challenge?

Practically use background including linear gradient background and place the image at the different position. 🚩 What I'd like to improve but haven't found the solutions?

A comfortable workflow to create simple challenges.

I would like to hear any suggestions from you :) happy coding.

I am struggling with changing the text of "25% discount" to "-25%" . I now have managed it when the user toggle on the billing type. While I don't know how to let it be changed along with screen size like normal css media queries.

Thank you for your help!

Happy coding!!

💡What do I learn from this challenge?

• add/remove simple css with jquery to improve user experience

🚩What I'd like to improve but haven't found the solutions?

• how to change the style of alert when the input data is invalid

In this challenge, I created cards section through @mixin.

What I've learnt from the challenge:

• gap property for flex is not supported by some browsers including Safari. Please see this reference I found. ( https://css-tricks.com/almanac/properties/g/gap/)

As usual, I welcome any feedback and suggestions. :)

Happ coding!

The grid section is created with Bootstrap, and with the colours I have used darken/lighten property to slightly adjusted them.

I am a self-taught Frontend newbie and started my journey since late 2020. I am building my portfolio along with learning skills from these challenges. I am also welcome any feedback and suggestions. I am very keen to LEARN MORE.

Many thanks!