COVID-19

PROJECT: Covid-19 demo site
A single-page web app for news and articles about Covid-19. 
It is designed for small screen view size

PROJECT PURPOSES:
– Use and understand React design patterns
– Use private and public routing system 
– Make image slider 
– Create widgets and templates
– User signin and out with firebase authentication
– User dashboard for creating posts
– Using firebase database for storing posts
– Linking videos and video player system
– And many more features

TECH STACK:
– Build with: React Js, Javacript, HTML, CSS, Firebase Databse
– Deployment: Firebase
– Other tools:Git , Github

STATUS:
Finalized

LINKS:
Github
Live Demo

Zombie Apocalypse

PROJECT: Zombie Apocalypse in the time of Corona 
It’s a text based game. I’ve started this project during the lockdown.

PROJECT DEVELOPEMENT PROCESS:
After graduating from Makers Academy coding bootcamp, I’ve decided to improve my javascript skills by taking advantage of #April free offer from Plurasight. So I made the Zombie Apocalypse version 1.0 of the game, which only works with prompts and alerts.

To test my knowledge more I decided to improve the game by adding some visual and printing it on the screen. when I managed to do that I was motivated to add more visual so I used my design skills and made near 40 digital illustrations. I synced them with the story and  deployed the Zombie Apocalypse version 2.0.

At the moment I am working on the version 3.0 of the game which is focused more on code quality, responsiveness and editing some of its features and many more issues. 

TECH STACK:
– Build with: Javacript, HTML, CSS
– Illustration with: Adobe photoshop
– Deployment: Netlify
– Other tools:Git , Github


STATUS:
Ongoing project

LINKS:
Github
V1.0
V2.0

 

mnemonic​

PROJECT: mnemonic 
Team engineering final project for Makers Academy. 
A single-page web app game, based on the classic memory/ matching cards game. 

PROJECT DEVELOPEMENT PROCESS:
Final project in lockdown was a great challange for all of us as a team. Not being on the site and working closely together wasn’t easy but we managed to cut the distance between us by using  the remote tools  such as Zoom, Miro board, Slack and self discipline .  Not only we learned about agile and team work but also we are now ready to work fully remote.

TECH STACK:
– Build with:  
React.js, Javacript
– Tested with : 
Jest & Enzyme
– Continuous deployment : Travis CI, Coveralls, Heroku
– Remote team collaboration : Slack, Zoom, Miro white board
– Illustration by : I designed the cards with adobe photoshop

STATUS:
Finalized

LINKS:
Github
Live demo

Javascript Collection

Movie lister

Single page app for listing movies

Github User

Search and find github users with some info about them

Loan calculator

Great app to sort your finance towards paying your depth

Gussing game

Let's hang Adam

The old school guessing game

Weather

Show the weather on a specific location

PROJECTJavascript Collection
Series of single page app 

PROJECT DEVELOPEMENT PROCESS:
I learn javascript on daily bases. This programming language and its abilities, always inspires me to explore it more. I look at different resources all the time and try to make mini projects with different learning objectives. These series helped me to become  a better developer everyday.

TECH STACK:
– Build with: 
Javascript,
CSS, HTML
– Deployment: Netlify
– Other tools: Git , Github
– Graphics : I designed the images with adobe photoshop

STATUS:
Ongoing projects

LINKS:

For Live demo click on the thumbnail above.

Codes are available on the links below

Github for Movie lister Github for Github userGithub for Loan calculatorGithub for Let’s hang adamGithub for Weather app

CSS Collection

PROJECTCSS Collection
A playful project for understanding the power of css. 

PROJECT DEVELOPEMENT PROCESS:
For a front end developer knowing Css is the most. In this project I’ve tried to explore all aspect of CSS by following tutorials, W3 and other resources. Each link have its own page with different subject. I practice CSS regulary and this collection is expanding weekly.

TECH STACK:
– Build with:  
CSS, HTML
– Deployment: Netlify
– Other tools: Git , Github
– Graphics : I designed the images with adobe photoshop

STATUS:
Ongoing project

LINKS:
Github
Live demo

©Bdesignstuio.co.uk 2018