Fun Projects to Improve Your Dev Skills

No Images? [Click here]( [SitePoint]( Hey there! If you've been looking for a more engaging, practical way to learn or improve your skills, then our project tutorials are ideal. They allow you to piece together ideas, principles and techniques, without having to dig through hours of boring documentation. Plus, they give you a gratifying result (and often usable code) at the end of it, that you can apply to your work! To inspire your learning, we've highlighted some of the fun projects found in books throughout our library. Take a look below! Projects to help improve your skills: Create a Tinder Clone Using React Native Elements and Expo In this tutorial, we’ll be cloning the most famous dating app, Tinder. We’ll then learn about a UI framework called React Native Elements, which makes styling React Native apps easy. Since this is just going to be a layout tutorial, we’ll be using Expo, as it makes setting things up easy. [Start the project now]( Redesign a Card-based Tumblr Layout with CSS Grid In this tutorial we're going to re-implement a grid-based design concept inspired by a Tumblr page. You'll learn how to structure it, design the spaces, manage cards and more. [Start the project now]( Build a Game with Vue.js Utilize your JavaScript skills to build a game in Vue.js. Manage components, multiple states and rules. [Start the project now]( Create a Static Website with Hugo Learn to use Hugo, a static site generator (SSG) written in Go. Hugo boasts rich features, is very quick thanks to Go, and has lots of third-party themes, an active community, and detailed documentation. [Start the project now]( Redesign a Site to Use CSS Grid Layout Forget about table layouts and floats – a new way to design websites is already here! You'll see CSS Grid in action by creating a responsive multi-column website layout. [Start the project now]( Build a Full-screen Bootstrap Carousel with Random Initial Image Build two simple extensions for the Bootstrap carousel. First, you'll create a full-screen Bootstrap Carousel slideshow, and then you'll see how to randomize the first slide on page load. [Start the project now]( Create a to-do list in React Use two libraries (Redux and ImmutableJS) to create a simple to-do list in React. You'll learn how to easily create components and manage states. [Start the project now]( Make a chat app with Vue.js and Pusher. Build a real-time chat application using Vue.js powered by ChatKit. The ChatKit service will provide us with a complete back end necessary for building a chat application on any device, leaving us to focus on building a front-end user interface. [Start the project now]( Build a real time chat app with Node.js and Sails.js Learn the fundamentals of Sails.js, by building a simple, user-friendly chat application. [Start the project now]( Create data visualisations with D3 In this project, we'll take you through data sources, building charts, utilising SVGs and more to get you working with D3 in a couple of hours. [Start the project now]( Build a validated form with Vue.js Learn how to work with forms in Vue. We’ll start off by creating a simple form and look at how to use two-way data binding to keep user input in sync with our data model. We’ll then take a look at modifiers and filters, and finish off with validation. Each section has a runnable CodePen demo. [Start the project now]( Build a Shopping List App with Vue, Vuex and Bootstrap Vue Build a simple shopping list app using Vue, Vuex and Bootstrap. Along the way, you'll discover how Vue's official state management solution can help you manage state throughout your app as it grows. [Start the project now]( Create a Beautiful Chart Using Vue.js Wrappers for Chart.js Learn how to represent data in the form of various types of chart with the help of Chart.js and Vue.js. [Start the project now]( Want access to all these projects? [Join SitePoint Premium for just $9/m]( and you'll get access to 350+ books and courses full of projects! [Join SitePoint Premium!]( Happy learning! SitePoint Team SitePoint 48 Cambridge Street Collingwood, VIC 3066 | Australia You're receiving this email because you signed up to receive news from SitePoint. Smart choice! [Like]( [Tweet]( [Share]( [Forward]( [Preferences]( | [Unsubscribe](