Not Found
Not Found
Not Found
Oops! You need to be logged in to do that
Oops! You need to be logged in to do that
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Oops! You need to be logged in to do that
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All Solutions

  • Desktop design screenshot for the Fylo dark theme landing page coding challenge

    Fylo dark theme landing page

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I hope you like my version of the Fylo dark theme landing page. Please click the like button and leave a comment, thank you!

  • Desktop design screenshot for the Intro section with dropdown navigation coding challenge

    Intro section with dropdown navigation using Tailwind and Alpine.js

    #tailwind-css
    • HTML
    • CSS
    • JS
    3
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my fantastic version of the Intro section with dropdown navigation. I've build this lovely design using Tailwind and Alpine.js and it was rather easy. I hope you enjoy looking at it! Feel free to leave a little red heart for my work, thanks! âĪïļ

  • Desktop design screenshot for the Blogr landing page coding challenge

    Blogr landing page using Bootstrap and Sass

    #bootstrap
    • HTML
    • CSS
    • JS
    1
    Byron1,950
    Submitted

    Hello ladies and gentlemen, here's my interpretation of the Blogr landing page! I decided to help myself by use Bootstrap and Sass to style everything up. I think it's a nice simple design and it was a pleasure to build. Hope you all like it. Please leave a lovely little like, or maybe even a cheeky comment! 😄

  • Desktop design screenshot for the Tip calculator app coding challenge

    Tip calculator app using SvelteKit

    #svelte
    • HTML
    • CSS
    • JS
    4
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Had fun with this one, using SvelteKit. Used some lovely features of Svelte like bind: for that sweet, sweet reactivity between the inputs and the amount/total results. It was also nice to use the {#if} directive to conditionally show the validation messages, and {#each} came in handy for displaying the buttons. Anyway, I hope you all like it. Feel free to leave a saucy little comment if you like!

  • Desktop design screenshot for the Insure landing page coding challenge

    Insure landing page using Tailwind CSS

    #tailwind-css
    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, welcome to my Insure landing page! I decided to use Tailwind on this one for some reason. Feel free to leave a comment, or maybe even a like! âĪïļ

  • Desktop design screenshot for the Interactive rating component coding challenge

    Interactive rating component using SvelteKit

    #svelte
    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I present to you this lovely Interactive rating component, which I've built using SvelteKit. I think it's rather nice, I hope you think it is too!

  • Desktop design screenshot for the Pricing component with toggle coding challenge

    Pricing component with toggle

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my version of the Pricing component with toggle using plain old HTML, CSS and Javascript. Hope you like it!

  • Desktop design screenshot for the Todo app coding challenge

    Todo app using Next.js, sortablejs and localStorage

    #next#accessibility
    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, I present to you a fully featured todo list app. It has some lovely features like marking an item as completed and you can even re-order the todos with a splendid little drag and drop. It will even remember whether a todo is completed and what order you dragged it to. I hope you like it! 😅

  • Desktop design screenshot for the Fylo landing page with two column layout coding challenge

    Fylo landing page with two column layout

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, it's been a while since my last challenge. I recently got a new job so I've had less time to work on challenges. Here's one of the early landing pages, which I've done using plain HTML, CSS and a sprinkling of Javascript for the validation. Feel free to drop a like! 😄

  • Desktop design screenshot for the Advice generator app coding challenge

    Advice generator app using SvelteKit

    #svelte
    • HTML
    • CSS
    • JS
    • API
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I've built this advice quote generator app using SvelteKit. Fairly straightforward api call to get the quote on the page. There's probably a 'better' way to get a new quote when clicking the dice button, but I settled for a simple <button onClick="window.location.reload()"> to refresh the page instead. Hope you like it!

  • Desktop design screenshot for the Interactive pricing component coding challenge

    Interactive pricing component using Sveltekit and currency.js

    #svelte
    • HTML
    • CSS
    • JS
    4
    Byron1,950
    Submitted

    Hello ladies and gentlemen, here's my version of the Interactive pricing component! I've recently been getting some lovely practice in with Sveltekit. Also learnt about the <output> element, which can be used alongside the range input to output range values. All in all, quite a splendid little project. Leave a like, or maybe even a cheeky comment!

  • Desktop design screenshot for the Huddle landing page with curved sections coding challenge

    Huddle landing page with curved sections

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This one was really straight forward. Just some good old fashioned HTML, CSS and vanilla Javascript (for the footer email validation). I hope it gives people a fairly good idea about how to create a nice landing page. Right, I'm off to the pub! 😆

  • Desktop design screenshot for the IP Address Tracker coding challenge

    IP Address Tracker using SvelteKit

    #svelte
    • HTML
    • CSS
    • JS
    • API
    10
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I've had a stab at doing this IP tracker with the map using SvelteKit. I'm a bit of a noob with SvelteKit at the moment, so I've probably bodged it quite a bit. At least the styling is on point, though! 😅

  • Desktop design screenshot for the Intro component with sign-up form coding challenge

    Intro component with sign-up form using JustValidate

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This is my last newbie challenge, unless FE Mentor releases a new one. I've used JustValidate for some basic form validation. That's about it really, enjoy!

    Oh, and leave a like, or ask me which challenge I should do next.

  • Desktop design screenshot for the QR code component coding challenge

    QR code component using SvelteKit

    #svelte
    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I thought I'd completely over engineer this QR code component by using SvelteKit. Enjoy and leave a like ðŸĪŠ

  • Desktop design screenshot for the Base Apparel coming soon page coding challenge

    Base Apparel coming soon page using the picture element

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my version of the Base Apparel page using the <picture> element to swap between the hero images on mobile and desktop. Not much more to say about this one, other that it's fantastic. Please leave a like!

  • Desktop design screenshot for the Social media dashboard with theme switcher coding challenge

    Social media dashboard with theme switcher using grid and localStorage

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I have built this dashboard theme switcher app using localStorage. The browser should remember what theme is set even if you refresh or close the window. As always, feel free to leave a like or maybe even a comment. Thanks!

  • Desktop design screenshot for the Easybank landing page coding challenge

    Easybank landing page challenge hub using Sass

    #sass/scss
    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, I present the Easybank landing page! I've added a few little extras, like a fixed header and some hovers on the latest thumbnails. Feel free to leave lots of likes, please! Thanks 👍

  • Desktop design screenshot for the Ping single column coming soon page coding challenge

    Ping single column coming soon page using HTML, CSS and Javascript

    #accessibility
    • HTML
    • CSS
    • JS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen, thought I'd smash a quick one out before bed! 😉 Here's my version of the Ping coming soon page with some primitive vanilla Javascript validation for the email. Hope you like it!

  • Desktop design screenshot for the Job listings with filtering coding challenge

    Job listings with filtering using React and Tailwind

    #react#tailwind-css
    • HTML
    • CSS
    • JS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's another React project with Tailwind. Getting the filtering to work properly was quite tricky 😅. Really please with the final result for this one! Feel free to leave a like and maybe even a comment as well. Happy coding everyone!

  • Desktop design screenshot for the Huddle landing page with a single introductory section coding challenge

    Huddle landing page with a single introductory section using HTML, CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, here's a nice simple one using plain HTML and CSS. Hope you like it! Smash that like button, if you'd be so kind!

  • Desktop design screenshot for the Project tracking intro component coding challenge

    Project tracking intro component using Sass

    #sass/scss
    • HTML
    • CSS
    • JS
    1
    Byron1,950
    Submitted

    Hello ladies and gentlemen, here's my attempt at the project tracking intro component. I ran this through google lighthouse and got 100%, which was nice. Hope everyone has a great New Year!

  • Desktop design screenshot for the Single price grid component coding challenge

    Single price grid component using a utility approach with CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I decided to keep it really simple by using lots of little CSS utilities for this single price grid component. Feel free to give that like button a little tickle! ðŸĪ­

  • Desktop design screenshot for the Manage landing page coding challenge

    Manage landing page using Sass and Swiper JS

    #sass/scss#webpack
    • HTML
    • CSS
    • JS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my version of the Manage landing page using Sass, Swiper JS for the testimonials carousel, and vanilla JS for the mobile menu and primitive form validation in the footer. Hope you like it! Maybe even leave a lovely comment 👌

  • Desktop design screenshot for the Social proof section coding challenge

    Social proof section using Vanilla HTML and CSS

    • HTML
    • CSS
    1
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's a quick one for today, took me a couple hours to do. Vanilla HTML and CSS, nothing too special but I think I've nailed the design. Drop a like and a comment, thanks! 👍

  • Desktop design screenshot for the URL shortening API landing page coding challenge

    URL shortening API landing page using Sass and localStorage

    #sass/scss#fetch
    • HTML
    • CSS
    • JS
    • API
    4
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This was a rather nice challenge to do. I chose to use Sass without any CSS framework just for a laugh (also saves weight and there's one less dependency). Vanilla JS for the mobile menu, validation, copy to clipboard and fetch api. Also added a little fancy mobile menu toggle animation. It probably doesn't work in IE11, but who still supports that browser anyway? No one. 😆

    Like always, please leave a like and maybe a lovely little comment as well. Thanks!

    Update: I've added localStorage so the links should now persist!

  • Desktop design screenshot for the Four card feature section coding challenge

    Four card feature section using HTML and CSS

    • HTML
    • CSS
    1
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This was a nice little fun one. I used flexbox with some transforms to get the layout right on desktop. I also added some bonus hover states as well. Please leave a like and maybe even a cheeky comment!

  • Desktop design screenshot for the Room homepage coding challenge

    Room homepage using Sass and Bootstrap 5

    #bootstrap#sass/scss
    • HTML
    • CSS
    • JS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my version of the Room homepage using a pretty standard Bootstrap setup with Sass and Laravel mix. Hope you like it!

  • Desktop design screenshot for the REST Countries API with color theme switcher coding challenge

    REST Countries API with color theme switcher using React and Tailwind

    #react#tailwind-css
    • HTML
    • CSS
    • JS
    • API
    1
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This is my first React app on here. There's a couple of bits I struggled with so I've just left them out:

    • The border links on the country detail page
    • Having proper slugs for each of the country detail pages e.g. /country/czech-republic

    Also, tried looking into using local storage to persist some react state so that it remembers whether dark mode is on or not, but I sacked that off as well.

    I'm open to some lovely feedback from all of you. Thank you! 😅

  • Desktop design screenshot for the Fylo data storage component coding challenge

    Fylo data storage component using vanilla HTML and CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! I've coded up this lovely storage component using nothing but the finest HTML and CSS. Leave a like, and maybe even leave a comment! 😅

  • Desktop design screenshot for the Coding bootcamp testimonials slider coding challenge

    Coding bootcamp testimonials slider using Alpine.js

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my implementation of the testimonials slider using Alpine.js. You can even use the left and right keys to navigate the slides! Feel free to like, comment and follow. 😅

  • Desktop design screenshot for the FAQ accordion card coding challenge

    FAQ accordion card using Sass and vanilla Javascript

    #accessibility#sass/scss
    • HTML
    • CSS
    • JS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen! This one was rather fun. Lots of 'left a bit right a bit' with the background images. Thought I'd add some animations/transitions in there, too. Leave a like if you like!

  • Desktop design screenshot for the Testimonials grid section coding challenge

    Testimonials grid section using CSS grid

    • HTML
    • CSS
    2
    Byron1,950
    Submitted

    Hello ladies and gentlemen and welcome to my implementation of the testimonials grid section challenge. Hope you like it! Feel free to leave a comment or maybe even a cheeky like!

  • Desktop design screenshot for the Article preview component coding challenge

    Article preview component using CSS grid and flexbox

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, here's my version of the article preview component! I've added a hover state on the image for some extra style points. Leave a like âĪïļ and drop a comment 💎 to let me know what you think!

  • Desktop design screenshot for the Stats preview card component coding challenge

    Stats preview card component using HTML and CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen! Here's my attempt at the Stats preview card component.

    I think I nailed the background image with background-blend-mode, a violet colored pseudo element behind it and a touch of opacity. Leave a cheeky like, or maybe even a comment!

  • Desktop design screenshot for the Bookmark landing page coding challenge

    Bookmark landing page using Tailwind and Alpine.js

    #tailwind-css
    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, I present to you my version of the Bookmark landing page! Please have a look and drop a like! Maybe even leave a snazzy comment!

  • Desktop design screenshot for the Launch countdown timer coding challenge

    Launch countdown timer using HTML, CSS and Flip counter plugin

    • HTML
    • CSS
    • JS
    1
    Byron1,950
    Submitted

    Here's my lovely attempt at a countdown timer, ladies and gentlemen. Please press like and maybe even leave a comment!

  • Desktop design screenshot for the Time tracking dashboard coding challenge

    Time tracking dashboard using HTML, CSS and Javascript

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, feel free to drop a like and a comment!

  • Desktop design screenshot for the Space tourism multi-page website coding challenge
  • Desktop design screenshot for the 3-column preview card component coding challenge

    3-column preview card component using HTML and CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen, I give to you the lovely 3-column preview card component. Feel free to comment and like!

  • Desktop design screenshot for the NFT preview card component coding challenge

    NFT preview card component using HTML and CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    Hello ladies and gentlemen and welcome to my NFT preview card component! Smash that like button!

  • Desktop design screenshot for the Profile card component coding challenge

    Profile card component using HTML and CSS

    • HTML
    • CSS
    3
    Byron1,950
    Submitted

    Feast your eyes on this magnificent profile card component, ladies and gentlemen! Don't forget to like, share and subscribe haha

  • Desktop design screenshot for the Sunnyside agency landing page coding challenge

    Sunnyside agency landing page using Sass and Bootstrap 5

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Behold my grand implementation of this Sunnyside agency landing page, it is top notch! Please smash the like button!

  • Desktop design screenshot for the Order summary component coding challenge

    Order Summary Component using HTML and CSS

    • HTML
    • CSS
    0
    Byron1,950
    Submitted

    My solution to this is perfect and there is no room for improvement. I AM THE BEST

  • Desktop design screenshot for the E-commerce product page coding challenge

    E-commerce product page using Tailwind and Alpine.js

    • HTML
    • CSS
    • JS
    0
    Byron1,950
    Submitted

    Mostly playing around with Alpine.js so any feedback there would be cool. Any other feedback is welcome as well!