Skip to content

danyweis/oneDay

master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

#oneDay

Code everyday, learn everyday!

In this repository I challenge myself to create one project a day until I land a job.
#oneDay, Code everyday, learn everyday! This is a challenge to myself where I will try to create every day one small project (or if bigger over two or more days) until I land a position as a developer.

(For the moment I focus on learning Vue.js and I'm not creating projects but they will come back)

  • The important part of this challenge is that I code everyday and learn everyday. The same time I will document my journey.

  • Every challenge needs to be documented with a screenshot, description, what I used to create the project, what I learned in the project and it needs to have a start and finishing date.

  • Optional: Every 10th day I will create a summary where I will describe how the last 10 days went, if there was something I struggled with, if there is something I see that I get more comfortable with, if there is something significant that I learned and how I feel about the last days.

  • If you are new to coding and you want to make sure that you code everyday and maybe get a job in the industry if that is something you would like then feel free to create your own oneDay repository and to share your projects with the community .

  • If you do the challenge feel free to send me a link on Twitter to you project I would love to see what you created @CodeWeis and put the #oneDayCodeEverydayLearnEveryday or come and join the Facebook group

But don’t forget the most important thing is HAVE FUN and learn everyday !!


All the Projects


#1 Momentum clone

Momentum screenshot

Description:

In this project I recreated a basic Momentum clone.

What I used:
  • HTML
  • CSS
  • Vanilla JavaScript
What did I learn:
  • I get more deep in to work with the Date Object
  • I learned how to use local storage

Started & Finished: 19/05/2020


#2 Random background color on click

Random background color screenshot

Description:

This is a small project where the color of the background changes randomly on every click

What I used:
  • HTML
  • Vanilla JavaScript
What did I learn:
  • How to make text on a website unselectable

Started & Finished: 20/05/2020


#3 Color converter

Description:

This is a RGB to HEX and HEX to RGB converter

RGB TO HEX converter

What I used:
  • HTML
  • CSS
  • Vanilla JavaScript
What did I learn:

-I learned a lot about colors and that I still need a lot to learn about colors -Hot to take the users input and work with it

Started & Finished: 21/05/2020


#4 Flip a Coin

Description:

Just a simple coin flip for that I have time to focus on learning today

Flip a Coin

What I used:
  • Math.random()
  • Math.floor()
What did I learn:
  • toggle attribute

Started & Finished: 22/05/2020


#5 What age?

Description:

Input will be a birth date and it will tell you how long until your next Birthday or if it is your birthday

Preview of What age?

What I used:
  • JavaScript : date object
  • HTML : type date
What did I learn:
  • how to use type="date" value in JavaScript
  • how to find out if the browser is Safari and then to show type="number"

Started & Finished: 23/05/2020


#6 CSS Hero slider

Description:

This is a hero slider build with no JavaScript only CSS

CSS build hero slider preview

What I used:
  • CSS keyframes
What did I learn:
  • how to use CSS keyframes

Started & Finished: 24/05/2020


Update project #7

Description:

Today no finished project to show I do currently work on a bigger project since
the 25/05/2020, It is the guess the color game everything in HTML CSS AND Vanilla JavaScript

Guess the color


Update project #7

Description:

The game is now playable but still some bugs to fix and the time system is not yet in place

Guess the color


#7 Guess the color

Description:

This is the game guess the color

Guess the color

What I used:
  • HTML
  • CSS grid
  • Vanilla JavaScript
What did I learn:
  • how to handle user inputs on buttons
  • display elements depending on the inputs
  • the game works without page reload

Started & Finished: 25/05/2020 -> 27/05/2020

// There will be a time count implemented later on with storing best times in local storage


#8 Stop Watch

Description:

This is a simple stop watch wit start stop and reset function

screenshot stopwatch app

What I used:

  • Vanilla JavaScript
  • setInterval
  • clearInterval

What did I learn:

  • How to use setInterval
  • How to use clearInterval

Started & Finished: 28/05/2020


#9 Pomodoro

Description:

This is a small Pomodoro I created to be a google chrome extension

screenshot pomodoro

What I used:

  • Vanilla JavaScript
  • setInterval
  • clearInterval
  • CSS to creat an animation

What did I learn:

  • How to use setInterval
  • How to use clearInterval

Started & Finished: 29/05/2020


#10 Navbar

Description:

Navbar with hover effect and active highlight

screenshot navbar

What I used:

  • JavaScript mouseover
  • CSS ::after

What did I learn:

  • To do animation on hover with the css ::after
  • how to use e.target

Started & Finished: 30/05/2020


#11 Covid-19 API

Description:

ScreenShot Covid API

What I used:

  • fetch

What did I learn:

  • How to call an API

Started & Finished: 31/05/2020


#12 Your favorite Lyrics

Description:

Lyrics App

What I used:

  • Vanilla JavaScript with fetch

What did I learn:

  • Implement error handling

Started & Finished: 01/06/2020


#13 Crypto Tracker

Description:

This is a project which I will grow by time the more I learn

Crypto app

What I used:

  • Two crypto API's which I mix to get the info I wanted

What did I learn:

  • How to mix two APIs

Started & Finished: 02/06/2020


#14 Pokedex

Description:

This is an easy Pokedex in which I started using Vue.js

Pokedex

What I used:

  • Vue.js

  • Two Pokemon API's

What did I learn:

  • Started to work with Vue.js

Started & Finished: 05/06/2020


#15 Weather App

Description:

This is an weather app showing information's about the weather

Screenshot Weather App

What I used:

  • Weather API

  • Vue.js

What did I learn:

  • I try to use Vue.js more and more

Started & Finished: 09/06/2020


Update:

Today we are the 14th June, I started this repo almost one month ago and wanted to do an update, I started to learn Vue JS so I don't push a project everyday because it takes a bit time to find the answers to all the questions which come over the time of a project. But I get mor confident with the syntax and all the small details. To soon come back to one project a day for the moment I did update the Crypto project which is not in the list now but it has his own repo because it will become a bigger project .

Anyway I started my next project in Vue JS and it will be soon pushed.


#16 Landing page ArchiModern

Description:

This is a Modern Landing page build with VueJs

Screen shot

What I used:

  • Vue JS

What did I learn:

  • How to switch from one component to an other without destroying the component

  • How to use Mixins

  • How to call two methods on one link

Started & Finished: 14/06/2020


#17 Paper Rock Scissors

Description:

I created a small Paper Rock Scissors game

Screenshot Paper Rock Scissors App

What I used:

  • Vanilla JavaScript

Started & Finished: 19/06/2020


#18 ISS Position

Repository

Description:

In this project you can see the position of the ISS Space station in real time.

ISS Position Screenshot

What I used:

  • API for the Longitude and Latitude

What did I learn:

  • How to calculate the Longitude and Latitude and put them on the correct position on the map

Started & Finished: 21/06/2020


#Number Name

Description:

Description

What I used:

What did I learn:

Started & Finished: 28/05/2020

About

In i will create one project a day

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published