DEV Community

lucsan
lucsan

Posted on

Need a simple project to sharpen your skills?

I often hear people saying they need a simple project but they are overwhelmed by all the options, well he's the simple guide to creating a simple project for your needs.

First you need a little bit of data, this is the internet after all, and its all about the infonation.

Don't 😰 sweat it, you don't want to spend ages searching the internet, finding heaps of data, parsing it, cleaning it, sorting it (unless your into Machine Learning), in stead make a simple table 📑.

It doesn't matter if your data is a piddly little 4 by 4 table of, say, fruit, price, weight, and img (with 4 fruits in it), this is sufficient data for any project, simply replace fruit with your favorite thing if you don't like fruit, you weirdo.

So armed with a 🍌 banana and 3 other fruit (🍎🥑🐷), the next part, while simple, is harder, you need to focus on the part of the job you want to demonstrate.

So, if you wish to demonstrate DB mastery, put the table in a database, for CSS magicians, just make the table in html then look at it in a browser, for programing gurus make the table an array or object or list, or directory, or data cluster.

Now look at your table and 🤔 think about what next? what do you want to achieve? A page listing your fruit 📰 and an individual page for each fruit? a 📊 graph of fruitiness?

For Database simply devise as many ways of getting your fruit data, for programming, as many was of manipulating your fruit data, and for front-end as many ways of presenting your fruit, as you can, then do a few of them.

🎈 At this point you have more or less completed your project, simple eh! 🎉

If your a front-ender, then sensibly you made your table into a set of html pages with the data written directly into the pages. maybe you used Sass or Less, well you can upload it all to github and make a github page which will run your site.

For the rest of us the matter of tool chain becomes more important, your luverly database with its tables and SQL statements that provide fruity 🍏 goodness in a variety of formats, can only be seen via a database viewer (ie: client), you probably want to display your 🍒 fruitformation on the webs as well. Similar may be said for programmers.

It depends on how much of the development sequence you want to demonstrate as all parts can be dealt with by a something else, to the extent you could create a project with bits found else where on the internet.

Resources like Netlify (Amazon), Firebase (Google), and Glitch (don't know) provide webspace and tool chain. With Netlify you can use AWS lambda functions, and with Firebase the Google equivalent, and of course, you can use all three together in some way (ie: get Glitch to call an AWS lambda function and use Firebase user login).

It may be that you can simply drag and drop your project into any of these. Alternately you can use your favorite database to html program which automatically generates web pages based on the database structure. Simply put, you can find a tool to do the jobs you don't want to. (proviso: this rule is only good for small projects, and you may spend a lot of time learning new tools).

💻 Here's an example of a small project I recently put together, with a simple stack.

I chose Netlify (over firebase) for no reason xept I needed one or other. Code in github (obvo) , simple taskrunner in npm (using node scripts).

If your interested https://github.com/lucsan/SpockScissorsPaper for the engine and https://spockpaperscissors.netlify.com/ to see the web app. The code for the app is at (rspalator running in React https://github.com/lucsan/ReactScissorsPaper)

For my little bit of data I remembered a project I devised a few years back a 🎲 Rock Paper Scissors engine which is given a set of items, and returns the result of pitching 2 items against each other. It takes any number of items, but defaults to 7.

This project alone is quite nice from a TTD perspective and might replace fizz-buzz (5s n 7s) for variety, ironically I haven't implemented tests as I wanted the engine for the data. This also allows me to have a dependency (the RPS engine), thus creating a build chain.

Then I created a React project which uses the RPS engine, in other words, a website which lets you play RPS.

Code bases on github. Netlify configured to run node build scripts on master update, (and, as and when, I'll get Travis involved too). If you wanted to add more backend then perhaps add a login (or an old school high score board, with just the 3 letters) saved to some db or other (or file).

For front-end there is plenty in the mechanics and the display of the game. I added some base bootstrap files, but you cold go mad with SASS, Grunt, etc.

Again the trick here is the simplicity of the data you use, and where you want to demonstrate skills, for Dev Ops just have lots of things which need to be connected, for backend make sure you add in a database, and maybe a shopping basket, for middle ware add in customer forms, room bookings etc, for front-end make sure your 3 pages look abso spanking.

The real trick is to focus on the part (skill) you want to demonstrate, or just go organically, I have a little table what do I do with it? I know I'll present it well, then I know, I'll add customers, a shopping basket, tax, discounts, discounts on bulk, unavailable goods notification, email updates on the state of the fruits, a database for customer queries about fruit, and their availability, tests for whatever, a build chain to put it all together, in short, whatevs you need/want/are excited to do with your little bit of data.

Hope this in some simple way helps you clarify your thoughts on your next project.

Top comments (0)