All solutions

What are you most proud of, and what would you do differently next time?

I decided to tackle this project to solidify my understanding of the Django web framework and so built this as a full-stack application. Login and Logout sections are also present, but I decided not to wire these up to the database, so they’re cosmetic only.

In the future, for projects of this score I’m assuming a front-end framework like React would work better, instead of vanilla HTML with Bootstrap CSS. I would also like to give Tailwind CSS a go.

What challenges did you encounter, and how did you overcome them?

I had limited experience with asynchronous JavaScript up to know, so had to learn to launch backend interactions (Database update) based on JavaScript events. jQuery’s ajax syntax simplifies this quite a bit (compared to the vanilla JavaScript) so it made it easier.

What specific areas of your project would you like help with?

Feel free to point out mistakes or room for improvement, especially in the JavaScript file where I used jQuery’s ajax functions to work with the Python backend. I almost certainly am not following convention (snippet bellow) with the way I accomplished it, so would appreciate feedback.

$.ajax({
    url: "/update_bookmarks/",
    type: "POST",
    dataType: "json",
    headers: {
        "X-Requested-With": "XMLHttpRequest",
        "X-CSRFToken": CSRF_TOKEN, 
        'item': $(this).find('.item-id').text()
    },

Thanks Frontend Mentor, these are great challenges, and make for great portfolio projects!

What are you most proud of, and what would you do differently next time?

Being able to implement all the various interactive elements on the page correctly, and making best use of the API data to display relevant info on the landing page.

What challenges did you encounter, and how did you overcome them?

Getting the API JSON data to populate the HTML page based on which items are available. This was tricky.

What specific areas of your project would you like help with?

Any general feedback, especially on the Javascript parts, would be appreciated.

What are you most proud of, and what would you do differently next time?

Nice project, great for learning the basics of API calls!

What are you most proud of, and what would you do differently next time?

Love the Javascript stuff, more so than the pure front-end design and element positioning.

What challenges did you encounter, and how did you overcome them?

Trying to get a better grip on CSS Bootstrap, but am finding it inadequate for anything beyond very basic layout. Maybe Tailwind is the way the go?

What specific areas of your project would you like help with?

How do seasoned developers use CSS with libraries such as Bootstrap or Tailwind? Is vanilla CSS with a preprocessor like Sass an option? Or is it largely indidivual preference?

Not sure what's being done to create the wavy background effect using a single SGV file. It almost looks like the file is being repeated and flipped on the x-axis. Not sure how to accomplish this with CSS. Any advice would be appreciated!

Hi there! I'm currently doing a full-stack intensive course and these challenges are very helpful in refining my CSS skills.

What did you find difficult while building the project? I didn't quite manage to center the list markers for the unordered lists, to vertically align it with the text. This seems overtly complicated (using flexbox within each <li> item) for such a small effect. Is there a better way to do this?

Do you have any questions about best practices? I'm learning a lot through these challenges, but I'm sure there are many, many areas for improvement. Things I don't see/know I'm missing. If you spot obvious areas for improvement, please let me know. I'm excited about improving my skills.

Many thanks!

Seems like the font-weight and font-sizing provided by the style design is not 100% the same as the reference pics provided... might be tiny differences between browser displays? In any case, not chasing pixel perfection :)