Code Sprint
We have an exciting coding challenge for you! Your task is to replicate a Figma design using HTML and CSS. This challenge will help you improve your front-end development skills.
Challenge Overview:
- Objective: Recreate the given Figma design using HTML and CSS
- Difficulty: Beginner
- Time: 20 minutes
- Skills: HTML5, CSS3, Responsive Design
To view the Figma design, please visit: Figma Design Link
Tip: Use AI Tools
To enhance your productivity and creativity during this challenge, consider using AI tools to assist you. Here are some ways AI can help:
- Generate initial HTML structure based on the Figma design
- Suggest CSS styles for responsive layouts
- Provide color palette recommendations
- Optimize your code for better performance
- Debug and troubleshoot issues in your code
Remember, while AI tools can be incredibly helpful, it's important to understand the code they generate and make necessary adjustments to meet the specific requirements of the challenge.
Here are some AI tools you can use:
- ChatGPT - A versatile AI assistant that can help with coding tasks
- Claude - An AI assistant capable of understanding and generating code
- Phind - An AI-powered search engine for developers
- Gemini - Google's advanced AI model for various tasks including code generation and analysis
- GitHub Copilot - AI pair programmer that integrates with your code editor
How to Submit Your Solution:
- Once you've completed your challenge, show your work to one of the volunteers.
- They will review your code and provide feedback.
- If approved, they will guide you on how to submit your solution.
Follow these steps to submit your solution via a Pull Request (PR) to our GitHub repository:
- Fork the repository: https://github.com/IIITKalyaniFOSC/iiitkalyanifosc.github.io
- Clone your forked repository to your local machine:
git clone https://github.com/your-username/iiitkalyanifosc.github.io.git
- Navigate to the cloned repository:
cd iiitkalyanifosc.github.io
- Create a new branch with a descriptive name:
git checkout -b figma-challenge-yourname
- Create your HTML file:
touch your-name.html
- Add your changes to the staging area:
git add your-name.html
- Commit your changes with a clear, concise message:
git commit -m "Add Figma challenge solution by Your Name"
- Push your branch to your forked repository on GitHub:
git push origin figma-challenge-yourname
- Go to the original repository and create a new Pull Request
- Fill in the PR template with details about your submission
- Submit the Pull Request and wait for review
Good luck, and happy coding!