Summer. Here is a list of fun and interesting ideas for training your coding skills.
The following list is a challenge to your skill, an inspiration, not a step-by-step guide to developing the projects listed.
YouTube chat clone (chat only)
I chose this challenge because YouTube is so ubiquitous and any decent employer will require you to implement similar functionality, albeit on a much smaller scale.
Here's what you'll learn by building a YouTube chat clone.
- Using the websockets API . In a nutshell, websockets are an advanced technology that allows a two-way interactive communication session between a user's browser and a server.
- User authorization. You need to give out nicknames to chat users and implement a simple registration.
- Form processing. In fact, absolutely all chats are nothing more than complex forms.
Instagram clone (Image gallery + comments section)
Instagram is really good at capturing our attention with a lot of pictures. Nobody goes to Instagram to read longreads. So let's try to emulate the part that works really well on Instagram: image gallery and giving users the ability to communicate through comments.
Here's what you'll learn by implementing an Instagram-like image gallery.
- Lossless image processing and uploading to cloud services like AWS, Azure, Google Cloud Platform, and others. I bet that Instagram has over 1 million image uploads per day. No photo can be distorted or lost - that's a big task.
- Working with images, rendering them efficiently in the browser without sacrificing quality and speed.
- User authorization. Allows users to register and comment on images.
Name generator for business
Shopify has a bunch of free tools available for entrepreneurs and one of them is the brand name generator. The business name generator does exactly what you'd expect it to do - it generates business names and checks the availability of the appropriate domain.
Here's what you will learn by building a business name generator:
- Checking available domain names (DNS) using API queries and presenting the results to the user.
- Form processing and validation. In case you haven't noticed yet, shapes are a big part of our daily life. Make sure they are filled in correctly.
- Filling and displaying tables with data. If you have relevant experience, try to make tables responsive and mobile-friendly.
Spotify Album View Screen
The design and user experience made Spotify a breath of fresh air. The reason Spotify is so popular is the simplicity and intuitiveness of the interface. Plus, Spotify is fast and sleek.
Here's what you'll learn by creating an album browsing screen from Spotify:
- Retrieving songs and albums (and data about them) through the Spotify API.
- Working with Web Audio API . You need a way to play and pause songs.
- How to Like & Favorite Songs & Create Playlists.
QR Code Generator
Use QR Codes to drive customer interest, drive traffic, and boost sales through print, email or web.
The demo app takes an email and a URL and embeds them into a QR code.
Here's what you will learn by creating a QR code generator.
- The basics of front-end development are about working with HTML, CSS and JavaScript.
- Form handling and user input. The user specifies the input data, and you put it in the QR code.
- Finally, you will learn how to work with QR codes and draw them on Canvas in JavaScript. To do this, you should use an already existing library (this can be done from scratch).
Clone profiles on GitHub
On your profile page on GitHub, you can tell people about your work by showing the repositories you are interested in, as well as how you contributed and how you communicated.
Here's what you learn by implementing profiles like on GitHub:
How to use GraphQL to get data (the latest GitHub API uses GraphQL ). If you're not interested in learning GraphQL, API version 3 uses the more traditional REST API .
Recreate the profile template. Try using frameworks like React.js, Vue.js, Svelte.js, Angular, etc. There is no wrong framework. They all achieve the same goal.
Find out the details of how to get a high-profile profession from scratch or Level Up in skills and salary by taking SkillFactory's paid online courses:
- Machine Learning (12 )
- Data Science (12 )
- (9 )
- «Python -» (9 )
- DevOps (12 )