We're happy that you're thinking about applying for our boot camp! This is the first step, and the most fun, in the application – The Coding Challenge.
This is your chance to make your personal mark on one of the most used web services out there today: Facebook. Specfically we will focus on their looking login page. We want you to make a re-make, meaning only a new look NOT any functionality. You can style it however you like, go bold or be more minimalistic, it doesn't have to look anything like it does today. Go wild and make it yours!
The most important thing is that you have fun doing it – and hopefully learn something new in the process.
This is how it looks today. We bet you can make a much better job! Good luck!
Your solution must contain:
- An image (can be a logo, photo or other image)
- Two input fields (username and password)
- A button
We don't expect a masterpiece, we expect you to spend about four hours on this assignment. If you haven't coded before we think you might have to add an hour or two to read some of the suggested reading material.
We know that all of you are beginners at programming - we will not judge your solution based on the quality of your code or amount of work. We do however want to see that you’ve touched on a bit of programming before and know what you’re getting yourself into.
Make sure to have fun during the process! Do something that you find interesting and motivating.
- Start by sketching with pen and paper how you want your version of Facebook's login page to look like.
- Structure your work. Break down your solution in smaller blocks. Estimate how long each block will take to build. Does it sound reasonable to finish? If yes, move on to the next step. If not, go back to step 1 and revise your scope.
- Download or clone this repository with templates and start coding.
We have given you a little head start. If you download all files from this project to your computer you will find a code folder. The code folder contains of two files, a index.html file and a style.css file. The most simple approach is to download a code editor and open them in, for example Atom.
In Atom you edit the files. After saving them you can click on the index.html file to open it in a web browser to see your webpage take shape. Then you should be all set – happy coding!
Hand in the assignment by:
- Create an account on Github.com
- Start a new repository or project, make sure it's public.
- Upload your whole code folder.
- Attach the link to the repository in your written application.
Good luck!
The coding assignment will be judged by a jury from the industry. All solutions will be anonymously judged, and what we will be looking for is your solution in relation to your previous knowledge – no need to panic!
If you haven't coded before we suggest these resources to get you started, but feel free to google!
Learning how to think as a web developer is learning how to be an expert in problem solving. Google will very much be you friend in this!
We also have a community on Slack in which we will post useful links and answer questions. Join here.
We have a range of channels setup – they're a great place to go to look for both help and inspiration, also feel free to contribute. They're completely optional to join, but we recommend it. There's several Slack channels in the group, here's a few we think might be of use to you:
- #help If you have any questions about your coding challenge or the program we're there to help.
- #resources Tutorials, design assets or other useful material.
- #general For anything else, funny links, great articles etc.
After completing this challenge we hope that you will understand more what programming is and if it's for you. You will also gain some knowledge in two of the biggest programming languages, HTML and CSS. But most of all, we hope you had fun!
If you managed to do everything super quickly and can't get enough of coding, here's some suggestions of what you can add. TOTALLY optional.
- Use a custom font using Google fonts.
- Make the page responsive and look differently on mobile than desktop.