I don’t really see any websites that allow you to practice webdev skills asides from JS. Maybe ask the user to make like a project or a simple website with the things they want implement and have them rank it and stuff?

    • alunyanners 🏳️‍⚧️🇧🇩OP
      link
      fedilink
      arrow-up
      4
      ·
      edit-2
      1 year ago

      Thank you, this is exactly what I wanted.

      A place where you’re tasked to make webpages/websites.

      (sucks they paywalled some of the assignments, but oh well)

  • punk_outcast@lemmy.world
    link
    fedilink
    arrow-up
    4
    arrow-down
    1
    ·
    edit-2
    1 year ago

    HTML and CSS are pretty simple. It just requires a good deal of reading the manual.

    Here are some links for reference:

    https://www.w3schools.com/html/default.asp

    https://www.w3schools.com/css/default.asp

    https://sadgrl.online/learn/sections/snippets

    If you want to post your website/web pages publicly, without having to pay for a domain, I highly recommend https://neocities.org/. A large number of people use that site as their testing ground, so it’s common to see websites with “under construction” GIFs and images on the homepage.

    If you’d rather practice locally, you can use something like python to launch a webserver on your LAN and visit it with http://192.168.1.X (X being the last number provided by your device the server is running on).

    You can find some instructions here: https://realpython.com/python-http-server/

    It’s worth looking around at all the different websites on neocities, and also thinking about what you’d like to see personally as a form of self-expression. That’s how I got started, and it’s quite fun seeing where the project’s development takes you.

    • alunyanners 🏳️‍⚧️🇧🇩OP
      link
      fedilink
      arrow-up
      2
      ·
      edit-2
      1 year ago

      Thank you for the learning resources, but like I said in another comment, I wasn’t looking for learning resources. I’m looking for places where you can practice HTML+CSS, places that tasks you to make a website/webpage, as like practice/exercise.

      I guess you’re suggesting me to try and replicate sites/webpages I may come across Neocities? (I heard of the place btw, I might make a site there soon)

      As for hosting a webserver locally, I’m using the Live Server extension on VSCode (ok it’s VSCodium but still), will that be enough for now?

      • punk_outcast@lemmy.world
        link
        fedilink
        arrow-up
        3
        ·
        1 year ago

        Small update: So I found something that may help you out a bit. It’s a resource with 40 challenges (code is provided if you choose to look at it) for different effects.

        URL: https://blog.bitsrc.io/40-html-css-projects-for-beginner-2021-5bd01ff62361?gi=119d34df83af

        There’s a lot in here that I haven’t experience in producing on webpages, so I may use it when I feel inspired to take another crack at it. Still not a Project Euler, unfortunately. Most people seem to just freestyle their web development to gain experience and practice.

        Again, I apologize if this isn’t quite what you’re looking for.

      • punk_outcast@lemmy.world
        link
        fedilink
        arrow-up
        2
        ·
        edit-2
        1 year ago

        You’re welcome for the resources. I think I may have slightly misinterpreted your intentions.

        I guess you’re suggesting me to try and replicate sites/webpages I may come across Neocities? (I heard of the place btw, I might make a site there soon)

        Yes and no. I was more thinking of you seeing interesting effects created by people on their webpages and trying to reproduce those effects. I am not too sure of any resources that function like Project Euler, for web design, unfortunately. I would actually like to know if there’s anything out there like that too (I hope so).

        I look forward to seeing your site, if you decide to share with us.

        As for hosting a webserver locally, I’m using the Live Server extension on VSCode (ok it’s VSCodium but still), will that be enough for now?

        That should do just fine. As long as you can get the site up and running and visit it on your LAN, it’ll do the job.

        Sorry I couldn’t be of more help on this.

  • albigu
    link
    fedilink
    arrow-up
    3
    ·
    1 year ago

    codecademy used to have some online exercises but I think they noticed that is not very profitable and now they mostly only do paywalled youtube “courses”. They might still have some tucked in there somewhere but I bet they’re still all pretty basic. Although not exactly what you’re looking for, you could practice CSS by trying to replicate the CSS on the CSS Zen Garden. The frontend mentor the other user recommended seems like the only big website doing frontend challenges anymore.

    • alunyanners 🏳️‍⚧️🇧🇩OP
      link
      fedilink
      arrow-up
      2
      ·
      1 year ago

      i’ve used codecademy before! i remember a lot of stuff there used to be free. mannn capitalism and the chase for profit really does ruin everything 😔 could’ve kept the exercises even after going for a profit-based motive 😭

  • Soviet Snake
    link
    fedilink
    arrow-up
    2
    ·
    1 year ago

    Exercism, although I am not sure if they treat them as languages, since they aren’t so maybe they don’t list them.

    • alunyanners 🏳️‍⚧️🇧🇩OP
      link
      fedilink
      arrow-up
      2
      ·
      edit-2
      1 year ago

      Yeah the Tracks page on Exercism does not have HTML+CSS. Only JS, PHP, TS.

      Btw why don’t y’all consider them programming languages? Given that they’re still code used to develop something.

      • A very oversimplified explanation is that to be a programming language, you need support for branching code (if statements and the like). HTML is a markup language and CSS is a style sheet language. Apparently they’re Turing complete when used together, but implementing even the most basic algorithms in HTML/CSS is very impractical, and impossible when the languages are used separately

      • Soviet Snake
        link
        fedilink
        arrow-up
        1
        ·
        1 year ago

        Because they lack stuff that makes a language a language, they are a markup language similar to markdown, but it is true you need to remember it anyway.