Giter Club home page Giter Club logo

frontendmentor's Introduction

HIOSC X Hacktoberfest 2023 Frontend Challenges

This repo is created for Hacktoberfest 2023, a month-long celebration of open source software. It contains a collection of frontend challenges from [Frontend Mentor], a platform that provides real-world HTML, CSS and JavaScript challenges with professional designs.

The goal of this repo is to help beginners and experts in frontend development to practice their skills, learn new techniques, and contribute to open source projects. You can choose from different levels of difficulty and get feedback from other developers.

How to participate

To participate in Hacktoberfest 2023, you need to register on the [official website] and make four valid pull requests to any public GitHub repository by October 31st. You can read more about the [participation guidelines] and the [quality standards] on the Hacktoberfest website.

To contribute to this repo, you need to follow these steps:

  • Fork this repo and clone it to your local machine.
  • Choose a challenge from the Frontend Mentors and create a new branch for it. The branch name should be in the format challenge-name-your-name.
  • Create a folder with the name in this format challenge-name-your-name, this is where your task will be done.
  • Complete the challenge using HTML, CSS and JavaScript. You can use any framework or library you like, but make sure to follow the code style and the best practices for this repo.
  • Add your name and GitHub profile link to the CONTRIBUTORS.md file.
  • Push your changes to your fork and create a pull request to the main branch of this repo. Make sure to add a descriptive title and a screenshot of your solution to the pull request.
  • Wait for a review from the maintainer or other contributors. If your pull request is approved, it will be merged to the main branch. If your pull request needs some changes, you will get feedback on how to improve it.

Challenges

You can head over to Frontend Mentors for list of challenges that you can choose from. Each challenge has a zip folder you can download from that contains the starter files and the design files. You can also find a README file for each challenge that describes the requirements and the expected outcome.

Code style

This repo follows the [Google HTML/CSS Style Guide] and the [Airbnb JavaScript Style Guide]. You can use a code formatter like [Prettier] or [Beautify] to automatically format your code according to these rules.

Best practices

Here are some best practices that you should follow when completing the challenges:

  • Use semantic HTML elements and follow the HTML5 standards.
  • Use responsive design and make sure your solution looks good on different screen sizes and devices.
  • Use accessibility features and follow the Web Content Accessibility Guidelines (WCAG).
  • Use comments and meaningful variable names to make your code easy to read and understand.
  • Use Git and GitHub to manage your code and track your progress.
  • Write clean and modular code and avoid code duplication.
  • Use a linter like [ESLint] or [JSHint] to check your code for errors and bugs.
  • Test your code and fix any issues before submitting your pull request.

License

This repo is licensed under the MIT License.

Code of conduct

This repo follows the Contributor Covenant Code of Conduct. By participating in this project, you agree to abide by its terms.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.