Free Code Examples

Learn Robotics

2020-03-31T08:41:00.005-07:00

Robotics Resources

Glossary of Robotics Terms

https://en.m.wikipedia.org/wiki/Glossary_of_robotics

Vex V5 Architecture

https://www.vexrobotics.com/v5-architecture.html

Robot Mesh

https://www.robotmesh.com/

VexCode

https://www.vexrobotics.com/vexcode

Free Webstore

2019-09-27T06:21:00.003-07:00

Create your own Free Webstore

Have you ever wanted to join the 1000s of people making money selling online? Did you know you can create a fully functioning Web Store for Free?

Choose from lots of free templates customize your site add products and start selling today!

FreeWebStore offers an abundance of Free features including Free Templates, A Free Custom Domain, Fully Functioning Carts. Safe Checkout, and Much More.

Build your Dream and start today. This Free for Life Opportunity is well worth checking out.

Thanks and Happy Selling!

FreeWebStore

Free Video Learn Python

2019-07-16T20:29:00.000-07:00

Learn Python Programming for free.

Vitamin C Gummies

200+ Programming Resources

2019-07-16T10:44:00.000-07:00

200+ Programming Resources

This is an Open Source project created by my friend KrOW started on Sololearn and continuing to grow on Github. This program contains over 200 links and Resources to help Programmers at every level find helpful information.

*Featured Code Created by KrOW

I love how KrOW added a link to see this code running in this Github repo reading the code is awesome in many aspects but it helps me so much to see a code running to fully grasp it's potential. If you have links you would like to see added feel free to leave them in comments here and I will forward them to KrOW or suggest/add them via Sololearn or Github.

Thanks and Happy Coding!

Major Outage hits Well-known Programming Site

2019-07-16T07:40:00.001-07:00

International Programming Community Experiencing Major Outage

A well know website and app for Programmers with millions of members is experiencing a major outage.

The site has been down for over 12 hours leaving many students and professionals unable to access their programs, projects, games, homework, and codes stored on the site.

Sololearn has reached out to its millions of international members using social media to let them know they are working to resolve the issue as quickly as possible.

Sololearn is an educational app and website where players can learn Programming skills for free in a game like environment.

Members can learn and practice the basics of 12+ programming languages including Python, C#, Java, Ruby, Php, and more... The site offers a helpful and encouraging community of new to professional programmers willing to answer your questions and share ideas.

Some members are expressing concern about the major outage but overall the community is grateful for this awesome free app and are waiting patiently for the site to return so they can continue their 100s of days streaks and say hi to their like minded friends around the world.

Hopefully the website and app will be up again soon. When it is I hope you will join us and experience the joy of learning in this exciting awesome community.

Learn Bug Bounties

2019-06-28T09:26:00.003-07:00

How to get started in Bug Bounties

This is a great video for anyone wanting to earn money from Legal Bug Bounties. Learn tips and tricks to get you started.

Crypto Mining

2019-06-27T19:39:00.001-07:00

How to create a free website to mine Cryptocurrency

Step 1: Create a Free Blog or Website using Blogger. Wordpress or any other free Hosting. Find out how on this post...

How to Create your own website or blog for Free

Step 2: Add a simple Javascript mining Algorithm by adding a simple script from one of these sites...

Coinimp

JSECoin

It's that simple just add quality content to your sites and watch your Crypto Wallets Grow!

Free Cloud Mining

Who wants to be a Millionaire Learn JavaScript

2019-05-01T12:13:00.000-07:00

Play and Learn JavaScript

Who wants to be a Millionaire Learn JavaScript

More Free Learning Games

Play and Learn Javascript

Play and Learn Javascript Terms

Javascript Scramble

How to Create your own Website or Blog for Free

2019-04-30T12:07:00.000-07:00

Free Websites and Blogs

Does this sound too good to be true? I promise you it's not and I will show you exactly how to do this yourself.

Step 1 Join Blogger

Blogger is a part of Google it provides an easy to use platform for creating, adding to, and editing Blogs and Websites. Free hosting, and even your own domain using .blogspot.com

It's 100% free to join and use. With tons of Free Resources Blogger provides to add widgets and exciting content to your sites.

Step 2 Create

Tap a few buttons to agree to terms then choose a name for your new Blog or Website below that create the web address if what you want isn't available just try variations until you find something that fits. You will also get the option to purchase a custom domain if you want. Next pick a template. No worries this will be easy to change at anytime so just select one you like and Create.

Step 3 Add Content

Your new Website or Blog is already live on the internet it was that simple. I'm sure you want a little more than just the template and your Blog Name so let's create content. Select New Post add a title, type, add pictures, links, whatever you like and hit publish. Click View blog to see your new content added.

Now you have worked hard for the last few minutes to create this right? Just kidding it was easy but still you want people to see the genius who created this correct? Go to settings then user settings you will see User Profile click edit under Blogger to the right. Go to Profile Photo add one add more information about yourself if you like scroll down select Save Profile and that's it everyone will now see who created this site. View your blog again and enjoy being a fellow Website owner.

That's it continue to create content as you please customize your site if you like by clicking theme then customize. You can also try layout where you can add dozens of Free Widgets to add awesome content to your new site.

Congratulations new Website owner I look forward to visiting your site feel free to drop a link to it in comments here so I can visit. Let me know if you want more instructions to create awesome websites and Blogs using Blogger

Free Code Examples Directory

2019-04-01T07:48:00.000-07:00

Share with Friends

Free Code Examples Directory and List of Codes by Language

Free Code Examples is an excellent Resource for learning new Programming Syntax or just grabbing a piece of Code to add to your Current Project

Java Codes

Java Current Time snd Date

Java Random Numbers

Java Square Root Cube Root Square and Cube of Number

Java Code to Reverse Number

Java Code to Reverse String

Java Program to Check if Input is Vowel

Java Odd or Even

Java Fibonacci Sequence

Java Program to Create a Diamond

8 Codes to find Versions

Hello World in 10 Programming Languages

Python Codes

Rock Paper- Scissors Game with Python

Card Deck Class with Python

Python GUI Fun with Turtle

Python Word Repeater Program

Scientific Notation using Python

NASA API with Python

Machine- Learning Logistic Regression

Python Machine Learning Linear

Python Code to Reverse a String

Silly Sentences using Python

Python Code to Convert Years to Days

Multi-tap keypad text entry using Python

Vigenere Cipher

8 Codes to find Versions

Hello World in 10 Programming Languages

C++ Codes

C++ Check for Palindrome

19 ways to Print Hello World with C++

C++ String Rotation

C++ Multiply 2 Overflow Numbers

C++ Code to Reverse a Number

C++ Odd or Even

C++ Code to Reverse a String

C++ Guess the Number

Make Shapes with C++

8 Codes to find Versions

Hello World in 10 Programming Languages

C Codes

Fibonacci Sequence using C

C Odd or Even

Reverse a Number Using C

C# Codes

Fizzbuzz you Choose

Javascript Codes

Javascript Current Date and Time

Awesome Game Controller

EZ Share

DNA Animation Example

Awesome Login

Javascript Easy Battleship Game

Javascript Temperature Conversations

EZ Image Slider

Battlebot 1 Sawhorse

Memory Game Template

Countdown to Christmas

Free Clothing Store Website Template

Smooth Scroll- Paragraph

Html Color Selector

Snake Game

Javascript Machine Learning Program

Javascript Substitution Cipher

Free Social Media Template

Javascript Code to Replace a Word

Waves Example Threejs

Php with Html Css and Javascript

Particle Wave

JavaScript Random Animal Generator Tutorial

Angular Click Counter

Free Analytics Website Template

Spooky Halloween Code

Hello World in 10 Programming Languages

Ruby Codes

Ruby Word and Letter Counter

Ruby Reverse a String

8 Codes to find Versions

Hello World in 10 Programming Languages

CSS Codes

Learn CSS Animation Tutorials

Split Image using CSS

Happy Holidays Panda

CSS Background 1

CSS Background 2

Free Blog Template

Free Clothing Store Website Template

HTML5

Simple Website Example

Memory Game Template

Awesome Login

HTML Cheat Sheets

Random Joke Generator

Free Flexbox Website Layout 1

Free Clothing Store Website Template

Html Color Selector

Snake Game

Adding Iframes to your Sites

Free Social Media Template

How to use Google Fonts

Free Blog Template

Convert text to ASCII HTML Code

Particle Wave

Battlebot 1 Sawhorse

Free Analytics Website Template

Countdown to Christmas

Resources

HTML Cheat Sheets

Programming Resources #1 Free Books

Programming Resources #2 More Free Books

Programming Resources #3 Free github ebooks

Top Ten Best Apps to Learn Programming

Top Ten Best youtube Channels to Learn Programming

Top Ten Best Javascript Books

Top Ten Best Python Books

Top 10 Best Books for Creating Android Apps

Top Ten Best Java Books

200+ Programming Resources

Javascript Fact Series by Morpheus

Free Analytics Website Template

Sololearn Courses

Sololearn Advanced Search

Free Clothing Store Website Template

Featuring Tutorialspoint IDE and Tutorials

Great Code Challenges

Great Code Challenge #1 Unit Converter

Great Code Challenge #2 Reverse a String

Great Code Challenge #3 Current Date and Time

Great Code Challenges #4 Reverse a Number

Great Code Challenges #5 Fizzbuzz

30 Days of Code Challenge

Game Challenge 1

Dev Tools

Speed Test

Convert Text to ASCII HTML Code

Awesome Game Controller

Html Color Selector

Sololearn Advanced Search

EZ Share Multi Share Buttons Creator

Javascript Current Date and Time

8 Codes to Find Versions

Java Current Time and Date Program

Free Analytics Website Template

Angular Click Counter

Featuring Tutorialspoint IDE and Tutorials

Free Website Templates

Free Social Media Template

Free Blog Template

Free Clothing Store Website Template

Simple Website Example

Free Analytics Website Template

Memory Game Template

Free HTML5 Learning Games

Play and Learn HTML5

HTML5 Tags Scramble Game

HTML5 Crossword 1

Who Wants to be Millionaire Learn HTML

Free Javascript Learning Games

Play and Learn Javascript

Javascript Hangman

Javascript Terms Crossword

Free Python Learning Games

Play and Learn Python Programming

Python Terms Scramble

Python Q and A Crossword

Free Games with Source Code

JavaScript Easy Battleship Game

C++ Guess the Number

Memory Game Template

Rock Paper Scissors with Python

Jets Shootout

Snake Game

Bobbies Games

Bobbies Games Directory

Gameland

Free-Games-Fun

Free-Classic-Games

Smart Kids

Free Code Examples is a Growing Project check in frequently for our latest additions

Try these Fun Games by Bobbie:

Travel Blast Game New York

Play and Learn Russian

Battlestarship Game

Take a look at these Groovy Codes:

Fun IQ Test

Html Svg Starburst

Javascript Particles Fishes

Read the Latest Breaking Programming and Tech News, Great Articles and Tips:

Codenewz Programming and Tech News

Top Ten Best Apps to Learn Programming

2019-03-31T07:22:00.000-07:00

The Top 10 Best Apps to Learn Programming Languages

#10 Encode

Encode offers bite-sized courses with code examples and challenges to get you coding. This is a good app for beginners who wish to learn the fundamentals.

#9 Udemy

Udemy is an online marketplace with over 80,000 courses available. Most of these are not free but if you search around you can find lots of great deals on them.

#8 w3schools

W3Schools is a great resource for online or offline Learning. It's easy to understand format is an asset to Beginners as well as Experienced Programmers.

#7 Udacity

Udacity offers a School of Programming as well as Schools for AI, Data Science, Nano Degrees and much more.

#6 mimo

Mimo is a fun app to learn not only Programming but Game Building, App Development, Ethical Hacking, and more.

#5 Coursera

Coursera offers many great courses from top rated universities. With the paid version you can earn certificates and even a degree.

#4 Khan Academy

Khan Academy has excellent Programming Lessons as well as many other subjects and it's totally free. Khan Academy is a non profit organization that offers an abundance of video and text lessons from experts.

#3 HTML Code Play

HTML Code Play has excellent code examples and useful information. My favorite part is the Facebook page where you will find a helpful community along with the creator Merbin who takes the time to personally answer many questions.

#2 Programming hub

Programming Hub has lots of languages to choose from with an easy to follow format. It's great for beginners or those wanting to review or pick up an additional Programming Language skills.

#1 Sololearn Learn to Code for Free

Sololearn is my personal favorite! With over 27,000,000+ learners you are never alone. This awesome community has helpful people always willing to answer your programming questions. With over 1500+ lessons you will find a lot to learn and share in this encouraging community.

I hope you enjoyed this Top Ten Best List and find it helpful. Please consider making a donation to support the developer. Thank you and have a Blessed Day.

CTF Resources

2019-03-09T10:15:00.000-08:00

CTF Resourses

Play Capture the Flag

HackerOne

XSS Game

PicoCTF

WeChall.net

ctftime.org

HacktheBox

Awesome CTF

Cybersecurity Tutorials

Cybersecurity and Ethical Hacking

Cybrary

Kali Linux Info

Install Video

Kali.org Tutorals

Learn Kali Tutorialspoint

Helpful Videos

Web App Hacking CTF Burp

//Sql Injection

//DDos

Additional Resourses

Vulnhub

HackerOne Sololearn Group Invite

Capture the Flag

2019-03-07T10:24:00.000-08:00

Capture the Flag

So what exactly is Capture the Flag? Excellent question there are many types of the game this introduction from Cybrary will help you to understand.

https://www.cybrary.it/0p3n/capture-the-flag-a-thorough-introduction/

My first experience with this came after reading this great article

https://www.infosecurity-magazine.com/news/19-year-old-awarded-more-than-1m-1-1/

I joined the site they mentioned in the article HackerOne and here my journey began.

HackerOne has a free CTF or Capture the Flag game that's awesome for beginners. I was a little nervous to jump right in so I watched one of the free videos they offer and joined the discord group for members.

https://www.hacker101.com/discord

Here I found a friendly community of people encouraging me to jump right in and give it a try. The Discord site also has a channel dedicated to each challenge with a few extra hints with folks willing to help if you get stuck.

I hope you will consider joining as a Programmer it's great to know how we can build better more secure codes and what better way to learn than thru a fun game. Thanks Happy Coding and Flag Capturing!

CTF Resources

Spiral

2019-03-02T09:04:00.001-08:00

Spiral

*Featured Code Created by Rull Deef

Source Code

HTML5 with CSS and JavaScript

<!DOCTYPE html>
<html>
<style>
body {
margin: 0;
background-color: black;
}

canvas {
width: 100vw;
height: 100vh;
position: absolute;
}
</style>
<body onload=init()>
<canvas></canvas>
<script>
var W, H, ctx;
var arr, max = 100;

function init() {
var canvas = document.querySelector('canvas');
canvas.width = W = window.innerWidth;
canvas.height = H = window.innerHeight;
ctx = canvas.getContext('2d');
ctx.fillStyle = 'rgba(0,0,0,0.15)';

arr = [];
for(var i = 0; i < max; i++)
arr.push({x:Math.min(W, H)/2.3*i/max, y:0});

animate();
}

function animate() {
window.requestAnimationFrame(animate);
ctx.fillRect(0, 0, W, H);

for(var i = 0; i < max; i++) {
var x = arr[i].x, y = arr[i].y;
var a = Math.sqrt(x*x + y*y) / 1e3;

arr[i].x = x*Math.cos(a) - y*Math.sin(a);
arr[i].y = x*Math.sin(a) + y*Math.cos(a);
}

ctx.strokeStyle = 'rgba(255,0,0,0.25)';
ctx.beginPath();
for(var i = 0; i < max; i++)
ctx.lineTo(W/2+arr[i].x, H/2-arr[i].y);
ctx.stroke();

ctx.strokeStyle = 'rgba(0,255,0,0.25)';
ctx.beginPath();
for(var i = 0; i < max; i++)
ctx.lineTo(W/2+arr[i].x, H/2+arr[i].y);
ctx.stroke();

ctx.strokeStyle = 'rgba(0,0,255,0.25)';
ctx.beginPath();
for(var i = 0; i < max; i++)
ctx.lineTo(W/2-arr[i].x, H/2+arr[i].y);
ctx.stroke();

ctx.strokeStyle = 'rgba(255,255,0,0.25)';
ctx.beginPath();
for(var i = 0; i < max; i++)
ctx.lineTo(W/2-arr[i].x, H/2-arr[i].y);
ctx.stroke();
}
</script>
</body>
</html>

Click here to view this code via Sololearn

Search Free Code Examples

2019-03-01T07:11:00.000-08:00

Search Free Code Examples

Learn for Free

2019-02-21T15:45:00.003-08:00

Free Online Education

Technology has had many positive effects on the world one of the greatest is information accessibility. Each day more and more opportunities arise. The following is a list of Resources for Free Online Education.

Free Online Degree Programs

393 Free Online Courses

50 Places to Find Free College Courses

400 Free Online Courses with Credits that Count towards your Degree

10,000+ Free Online Courses

MIT OpenCourseWare

If you are interested in Free Online Education I urge you to check out the above links and search online please share helpful results and Resources in the comments. Thanks and Happy Learning!

Snake Game

2019-02-17T10:06:00.000-08:00

HTML5 Snake Game

*Featured Code Created by Madhav

Source Code

HTML5 with CSS and JavaScript

<!--

Name : 🐍Snake [ 🎮 Game ]

Author : Madhav Jha

version : 1.3.2

Loader : Snake loader (i.e previously made by the same author)

NOTE : Inform me / Ask permission before using it.

DO NOT COPY , PLEASE !!!

version update : 1.3.2

--new result system added to tell game over or game win

--fullScreen option

--Level system

-->

<!DOCTYPE html>

<html>

<head>

<title>🐍Snake [ 🎮 Game ]</title>

<style>

body {

margin:0; padding:0px;

background-color:#262626;

color:white;

font-family: 'Sarabun', sans-serif;

user-select:none;

font-size:14px;

background-image:-webkit-linear-gradient(right,#134E5E,#71B280);

}

#fullScreen,#normScreen {

position:absolute ;

top:10px; right:10px;

width:30px; height:30px;

transition-duration:0.2s;

box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 3px 5px rgba(0,0,0,0.3);

cursor:pointer;

border-radius:50%;

transition-duration:0.3s;

}

#fullScreen:active {

transform:scale(0.8);

box-shadow:none;

}

#normScreen {

transform:scale(0);

}

#normScreen:active {

transform:scale(0.8);

box-shadow:none;

}

.container {

display:block; position:relative ;

margin:auto; width:300px;

margin-left:30px;

margin-top:40px;

filter:blur(3px);

}

#instruction {

position:absolute;

width:84%; height:465px;

max-width:330px;

top:0; bottom:0;left:0; right:0;

margin:auto;

z-index:1;

text-align:center;

background-color:teal;

padding:8px;

transition-duration:.15s;

box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 3px 5px rgba(0,0,0,0.3);

border-radius:8px;

}

h2 {

border:3px dashed white;

padding:12px;

margin:0;

border-radius:8px 8px 0 0;

}

h3 { margin-top:-10px;

margin-bottom:15px; }

img {

width:83%; max-width:430px;

height:255px;

}

#pStart,#playAgain{

width:85%; padding:10px;

max-width:400px;

font-size:20px;

background-image:-webkit-linear-gradient(right,#06beb6,#48b1bf);

color:white;

margin-bottom:5px;

outline:none; border:none;

border-radius:8px;

transition-duration:0.2s;

box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 3px 5px rgba(0,0,0,0.3);

cursor:pointer;

}

#endCard {

position:absolute;

width:85%; height:160px;

max-width:300px;

top:0; bottom:0; left:0; right:0;

margin:auto;

z-index:1;

transform:scale(0);

text-align:center ;

transition-duration:.3s;

}

#result {

position:relative ;

font-size:32px;

z-index:1;

font-weight:bold;

margin:10px;

}

#playAgain {

position:absolute;

width:80%; height:55px;

max-width:270px;

top:0; bottom:0; left:0; right:0;

margin:auto;

z-index:1;

transition-duration:.3s;

}

button:active {

transform:scale(0.83);

box-shadow:none;

}

#canvas {

background-color:#37474F;

box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 3px 5px rgba(0,0,0,0.3);

filter:blur(0);

}

#board {

font-size:24px;

font-family: 'Sarabun', sans-serif;

}

#score {

display:inline-block ;

margin:2px;

}

#playSound {

position:relative;

display:inline-block ;

float:right; margin:5px;

margin-top:-30px;

margin-right:50px;

margin-left:210px;

font-size:24px;

}

#sound,#nosound {

position:absolute ;

cursor:pointer;

}

#sound {

visibility:hidden;

}

footer {

text-align:center;

font-size:10px;

color:#efefef;

font-family: 'Aleo', serif;

}

footer > span {

color:red;

font-size:16px;

}

#food {

display:none;

}

@keyframes pop

{

{ transform:scale(0.7); }

34%

{ transform:scale(1); }

66%

{ transform:scale(0.9); }

100%

{ transform:scale(1); }

}

/* Loader Starts from here */

#container

{ display:block;

position:fixed; top:0;

height:100vh; width:100vw;

background-image:-webkit-linear-gradient(right,#134E5E,#71B280);

visibility:hidden;

animation:vanish 3s linear;

z-index:5;

}

@keyframes vanish {

0%{visibility:visible;}

100%{visibility:hidden;}

}

#container:before {

color:white;

content:"23%";

font-family: 'Aleo', serif;

display:block ;

text-align:center ;

position:relative ;

margin:auto;

top:calc( 50% - 25px);

font-size:22px;

animation:percent 2.97s infinite;

}

@keyframes percent {

0% {content:'0%';}

20% {content:'22%';}

30% {content:'30%';}

40% {content:'43%';}

50% {content:'59%';}

60% {content:'64%';}

70% {content:'71%';}

80% {content:'82%';}

90% {content:'98%';}

100% {content:'100%';}

}

#loader

{

display:block ;

position:relative ;

height:100px; width:100px;

margin:auto;

top:calc( 50% - 100px);

border:10px dashed #93F9B9;

box-shadow:0 0 0 10px rgba(0,0,0,.4), inset 0 0 0 10px rgba(0,0,0,.2);

animation:rotate 8s linear infinite;

}

@keyframes rotate {

100% {transform:rotate(-360deg);}

}

#loader > span

{

display:block ;

position:absolute ;

height:100%; width:100%;

top:0; left:0;

overflow:hidden;

}

#loader > span:before {

content:"";

display:block ;

position:absolute ;

height:100%; width:100%;

top:0; left:0;

border:none;

border-top:10px solid white;

animation:animate 2s linear infinite;

}

@keyframes animate {

0% {left:-100%;}

25% {left:0;}

50%,100% {left:100%;}

}

#loader > span:nth-child(2)

{

transform:rotate(90deg);

}

#loader > span:nth-child(3)

{

transform:rotate(180deg);

}

#loader > span:nth-child(4)

{

transform:rotate(270deg);

}

#loader > span:nth-child(2):before

{

animation-delay:.5s;

}

#loader > span:nth-child(3):before

{

animation-delay:1s;

}

#loader > span:nth-child(4):before

{

animation-delay:1.5s;

}

/* here ends */

</style>

</head>

<body>

</div>

<h2>INSTRUCTIONS</h2>

<img id="swipe" src="https://dl.dropbox.com/s/ky6y15fl6rx6zo5/SwipeGesture.png?dl=0"

alt="swipe instruction" />

<h3>Swipe or use arrow keys to control the snake.<br>Click on <i class='fas fa-volume-off'></i> to play music .</h3>

<button id="pStart" onclick="game()">START</button>

</div>

<button id="playAgain" onclick="playAgain()">Play Again</button>

</div>

<div id="board">Level : <div id="score">0 - 0</div></div>

</div>

<footer>Made with <span>♥</span> By Madhav <sup> &copy</sup>2019 - ∞</footer> </div>

<source src="https://dl-web.dropbox.com/s/k64a811vpo8f1mz/Snake%20game%20theme%20song%201.mp3?dl=0"

type = "audio/mp3">

</audio>

<source src="https://dl-web.dropbox.com/s/kxe1gf2rt232jg2/eat.mp3?dl=0"

type = "audio/mp3">

</audio>

<source src="https://dl-web.dropbox.com/s/hnt77i48coqa4hw/score%20Sound%20.mp3?dl=0"

type = "audio/mp3">

</audio>

<source src="https://dl-web.dropbox.com/s/b618j1vdd4d0fer/dead.mp3?dl=0"

type = "audio/mp3">

</audio>

//important variables

var canvas,ctx,h,w;

var box = 30,fps = 4;

var foodPic = new Image() ;

var dir = "RIGHT" ;

var music,eat,lose,scoreM;

var count = false ;

var endCard, result, playagain;

var score, level = 0, maxScore = 2 ;

var point = maxScore; var run;

//change in direction on keyboard keypress

document.addEventListener("keydown",direction);

function direction(event) {

var key = event.keyCode;

if(key == 37 && dir != "RIGHT") {

dir = "LEFT";

} else if(key == 38 && dir != "DOWN") {

dir = "UP";

} else if(key == 39 && dir != "LEFT") {

dir = "RIGHT";

}else if(key == 40&&dir!= "UP") {

dir = "DOWN";

}

window.onload = function () {

//canvas work

canvas = document.getElementById("canvas");

ctx = canvas.getContext("2d");

w = canvas.width = Math.floor(window.innerWidth/box)*box - 2*box;

h = canvas.height = Math.floor(window.innerHeight/box)*box- 4*box;

//to draw food getting image

var img = document.getElementsByTagName("img")[3];

foodPic.src = img.src;

//the score board

score = document.getElementById("score");

endCard = document.getElementById("endCard");

result = document.getElementById("result");

playagain = document.getElementById("playAgain");

//design,muisc and animation

music = document.getElementById("music");

eat = document.getElementById("eat");

lose = document.getElementById("lose");

scoreM = document.getElementById("scoreM");

//for swiping actions

/* actual swipe capture */

canvas.addEventListener('touchstart', handleTouchStart, false);

canvas.addEventListener('touchmove', handleTouchMove, false);

var xDown = null, yDown = null;

function getTouches(evt) {

return evt.touches ||

evt.originalEvent.touches;

}

function handleTouchStart(evt) {

const firstTouch = getTouches(evt)[0];

xDown = firstTouch.clientX;

yDown = firstTouch.clientY;

}

function handleTouchMove(evt) {

if ( ! xDown || ! yDown )

{ return; }

var xUp = evt.touches[0].clientX;

var yUp = evt.touches[0].clientY;

var xDiff = xDown - xUp;

var yDiff = yDown - yUp;

if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {

/*Response part*/

if ( xDiff>0&&dir!="RIGHT") {

/* left swipe */

dir = "LEFT";

} else if ( xDiff<0&&dir!="LEFT") {

/* right swipe */

dir = "RIGHT";

}

else {

if ( yDiff >0&&dir!="DOWN") {

/* up swipe */

dir = "UP";

} else if ( yDiff <0&&dir!="UP") {

/* down swipe */

dir = "DOWN";

}

/* reset values */

xDown = null; yDown = null;

}

/* end */

};

//snake body

var snake = [] ;

snake[0] = {

x:box*3 + box/2,

y:box*3 + box/2,

};

snake[1] = {

x:box*2+ box/2,

y:box*3 + box/2,

};

//new head part

var snakeX = snake[0].x ;

var snakeY = snake[0].y ;

//food location

var food = {

x : box*5,

y : box*5,

};

//function to draw everything

function draw() {

drawGrid();

if(count) {

music.volume = 1;

}

//draw snake

for(var i=0;i<snake.length;i++) {

var color = (i===0)?"teal":"#FFDC3F";

drawArc(snake[i].x,snake[i].y,color);

}

//directions

if(dir=="LEFT") {snakeX -= box ;}

if(dir=="RIGHT") {snakeX += box ;}

if(dir=="UP") {snakeY -= box ;}

if(dir=="DOWN") {snakeY += box ;}

// new head co-ordinates

var newHead = {

x : snakeX ,

y : snakeY,

};

//adding new head

snake.unshift(newHead);

//increment of point if yes we add tail else we dont

if(food.x==snake[0].x - box/2 && food.y==snake[0].y - box/2 ) {

point--;

score.innerText = level + " - " +point ;

if(count) {

eat.volume = 1; eat.play();

}

}else{

snake.pop();

}

//draw food

drawFood();

//check for game over conditions

if(snakeX < 0||snakeX > w||snakeY < 0||snakeY > h||collision(snake)){

clearInterval(run);

result.innerText= 'GAME OVER';

endCard.style.transform="scale(1)";

playagain.style.animation="pop .4s linear";

playagain.innerText = 'PLAY AGAIN';

level =0; maxScore = 2 ;

document.getElementById("canvas").style.filter="blur(1px)";

if(count) {

lose.volume = 1; lose.play();

music.volume = 0;

}

//check for game over conditions

if(point === 0 ){

clearInterval(run);

result.innerText= 'YOU WIN';

endCard.style.transform="scale(1)";

playagain.style.animation="pop .4s linear";

playagain.innerText = 'NEXT LEVEL';

document.getElementById("canvas").style.filter="blur(1px)";

if(count) {

scoreM.volume = 1; scoreM.play();

}

level++; maxScore += 5;

}

//function to draw grid

function drawGrid() {

//to clear the canvas

ctx.fillStyle = "#37474F";

ctx.fillRect(0, 0, w, h);

for(var i = 0;i<=h/box ;i++) {

//vertical lines

ctx.setLineDash([1, 0.5]);

ctx.beginPath();

ctx.strokeStyle = "#efefef";

ctx.moveTo(0,box*i);

ctx.lineTo(w,box*i);

ctx.stroke();

ctx.closePath();

}

for(var i = 0;i<=w/box ;i++) {

//horizontal lines

ctx.beginPath();

ctx.strokeStyle = "#efefef";

ctx.moveTo(box*i,0);

ctx.lineTo(box*i,h);

ctx.stroke();

}

//function to draw snake body

function drawArc(x, y, color){

var r = box/2 - 4;

ctx.fillStyle = color;

ctx.beginPath();

ctx.arc(x,y,r,0,Math.PI*2,true);

ctx.closePath();

ctx.fill();

}

//function to draw food

function drawFood () {

var isOkay = true ;

//to check if food is not being printing on the snake

for(var i=1;i<snake.length;i++) {

if(food.x==snake[i].x - box/2 && food.y==snake[i].y - box/2 ) {

isOkay = false ; break;

}

//if all fine then draw else change co ordinates

if(isOkay ) {

ctx.drawImage(foodPic,food.x,food.y); } else {

food.x = Math.floor(Math.random()*((w/box)-1))*box;

food.y = Math.floor(Math.random()*((h/box)-1))*box;

drawFood ();

}

//to check if snake collides with its body

function collision(array){

for(let i = 1; i < array.length; i++){

if(array[0].x == array[i].x && array[0].y == array[i].y){

return true;

}

return false;

}

//to start the game

function game() {

run = setInterval(draw,1000/fps);

document.getElementById("instruction").style.transform="scale(0)";

document.getElementsByClassName("container")[0].style.filter="blur(0)";

}

//to play again

function playAgain() {

dir = "RIGHT" ; point = maxScore ;

score.innerText = level + " - " +point ;

//snake body

snake = [] ;

snake[0] = {

x:box*3 + box/2,

y:box*3 + box/2,

};

snake[1] = {

x:box*2+ box/2,

y:box*3 + box/2,

};

//new head part

snakeX = snake[0].x ;

snakeY = snake[0].y ;

//food location

food = {

x : box*5,

y : box*5,

};

run = setInterval(draw,1000/fps);

result.innerText= '';

endCard.style.transform="scale(0)";

playagain.style.animation="";

document.getElementById("canvas").style.filter="blur(0)";

}

//To control sound

function playSound() {

count = true;

music.play();

eat.play(); eat.volume = 0;

lose.play(); lose.volume = 0;

scoreM.play(); scoreM.volume = 0;

document.getElementById("sound").style.visibility="visible";

document.getElementById("nosound").style.visibility="hidden";

}

function noPlaySound() {

count = false;

music.volume = 0;

eat.volume = 0;

lose.volume = 0;

document.getElementById("sound").style.visibility="hidden";

document.getElementById("nosound").style.visibility="visible";

}

//to get fullScreen

function openFullscreen() {

//variable i.e our full html

let e = document.documentElement;

console.log("FullScreen will only work in your browser not on Sololearn");

document.getElementById("fullScreen").style.transform = 'scale(0)';

document.getElementById("normScreen").style.transform = 'scale(1)';

//checking if fullScreen is approved by user

if (e.requestFullscreen) {

e.requestFullscreen();

} else if (e.mozRequestFullScreen) {

//Firefox

e.mozRequestFullScreen();

} else if (e.webkitRequestFullscreen) {

//Chrome, Safari & Opera

e.webkitRequestFullscreen();

} else if (e.msRequestFullscreen) {

//IE/Edge

e.msRequestFullscreen();

}

function closeFullscreen() {

//variable i.e our full html

let e = document.documentElement;

document.getElementById("fullScreen").style.transform = 'scale(1)';

document.getElementById("normScreen").style.transform = 'scale(0)';

if (document.exitFullscreen) {

document.exitFullscreen();

} else if (document.mozCancelFullScreen) {

document.mozCancelFullScreen();

} else if (document.webkitExitFullscreen) {

document.webkitExitFullscreen();

} else if (document.msExitFullscreen) {

document.msExitFullscreen();

}

</script>

</body>

</html>

Click here to run this code via Sololearn

Click here to Play and be Inspired by 600+ Free HTML5 Games

Game Challenge #1

2019-02-16T10:02:00.001-08:00

Tap the Black Tile

Game Challenge #1

The Challenge is to create a Game similar to Tap the Black Tile. Try the game below and create a variation, clone, or game inspired by this one.

All languages are accepted. Just place a link to your game in comments for a chance to win. Suggested platforms Sololearn, Codepen, GitHub and others will be accepted.

Looking forward to seeing your creations. Best of Luck and Happy Coding!

Tap the Black Tile

Welcome to Free Code Examples

2019-02-04T14:00:00.000-08:00

Hello World!

Welcome to Free Code Examples

Welcome back if you are one of our 30,000+ page view visitors who has been enjoying this site online at https://www.freecodeexamples.com

Welcome to our new Free Code Examples app viewers! If you haven't already downloaded this tiny app you can find it here https://play.google.com/store/apps/details?id=e.g.freecodeexamples

We have included this new mobile friendly format to both the online and app versions.

This app will add new features and content frequently without the need for you to update using this Webapp format. You can find the numerous categories of content offered here by tapping the three bars to the left at the top to select a subject page with links to the 100+ pages of information available via this site and app.

You can also find a list of our pages arranged by catagories here on Free Code Examples Directory

I hope you enjoy this growing app feel free to make suggestions for new content using our comments section here, our community chat feature or by visiting Free Code Examples Facebook and Twitter accounts. Thanks and Happy Coding!

Play and Learn Sax

2019-02-04T09:10:00.000-08:00

Tap the letters above each note to play the song When the Saints go Marching In

Play and Learn Saxophone

Learn to Play Sax

To Play the Song above only play the lettered buttons.

The Yellow Notes below are for the G Scale

Thanks I Hope You Enjoy!!!

SourceCode

HTML with CSS and JavaScript

<html>

<head>

<title>Play and Learn Saxophone</title>

</head>

<style>

.box { position: relative; width : 450px; height: 600px; border: 0px solid #CCC;border-radius:0px; background: url("https://i.pinimg.com/236x/a8/05/0d/a8050db6324569efe2b022d1d0230572.jpg ");background-size: 390px,200px ; }

button {

width:17px;

height:30px;

border-width:2px;

border-style: solid;

border-color:black;

background-color:#ff00ff;

border-radius:100% ;

text-align:center;

font-size:20px;

padding: 1px 1px;}

#a {

width:15px;

height:20px;

border-width:1px;

border-style: solid;

border-color:black;

background-color:pink;

border-radius:100% ;

text-align:center;

font-size:20px;

padding: 1px 1px;}

#b {

width:40px;

height:50px;

border-width:1px;

border-style: solid;

border-color:black;

background-color:yellow;

border-radius:100% ;

text-align:center;

font-size:20px;

padding: 1px 1px;}

</style>

<body>

Learn to Play Sax</h2>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play7" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0565.mp3

"></audio> <button onclick="playSound7()">G</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play7" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0565.mp3

"></audio> <button onclick="playSound7()">G</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play4" src=" http://88.198.78.90/ct/files/mp3/alto_saxophone/0587.mp3

"></audio> <button onclick="playSound4()">D</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play7" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0565.mp3

"></audio> <button onclick="playSound7()">G</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play1" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0571.mp3

"></audio> <button onclick="playSound1()">A</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play1" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0571.mp3

"></audio> <button onclick="playSound1()">A</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play2" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0577.mp3

"></audio> <button onclick="playSound2()">B</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play1" src="http://88.198.78.90/ct/files/mp3/alto_saxophone/0571.mp3

"></audio> <button onclick="playSound1()">A</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<audio id="play0" src="https://www.soundjay.com/misc/magic-chime-02.wav

"></audio> <button id="a" onclick="playSound0()">*</button>

<strong>To Play the Song above only play the lettered buttons. <br /><br />The Yellow Notes below are for the G Scale</strong></div>

<strong>Thanks I Hope You Enjoy!!!</strong></div>

function playSound0 () { document.getElementById('play0').play(); }

function playSound1 () { document.getElementById('play1').play(); }

function playSound2 () { document.getElementById('play2').play(); }

function playSound3 () { document.getElementById('play3').play(); }

function playSound4 () { document.getElementById('play4').play(); }

function playSound5 () { document.getElementById('play5').play(); }

function playSound6 () { document.getElementById('play6').play(); }

function playSound7 () { document.getElementById('play7').play(); }

function playSound8 () { document.getElementById('play8').play(); }

</script>

</div>

</body>

</html>

Social Media Template

2019-02-03T14:15:00.001-08:00

Free Social Media Template by w3

"W3.CSS Website Templates

We have created some responsive W3.CSS website templates for you to use.

You are free to modify, save, share, and use them in all your projects."

Source Code

<!DOCTYPE html>

<html>

<title>W3.CSS Template</title>

<style>

html,body,h1,h2,h3,h4,h5 {font-family: "Open Sans", sans-serif}

</style>

<a href="#" class="w3-bar-item w3-button">One new friend request</a>

<a href="#" class="w3-bar-item w3-button">John Doe posted on your wall</a>

<a href="#" class="w3-bar-item w3-button">Jane likes your post</a>

</div>

</a>

</div>

<a href="#" class="w3-bar-item w3-button w3-padding-large">My Profile</a>

</div>

<h4 class="w3-center">My Profile</h4>

<hr>

<p><i class="fa fa-pencil fa-fw w3-margin-right w3-text-theme"></i> Designer, UI</p>

<p><i class="fa fa-home fa-fw w3-margin-right w3-text-theme"></i> London, UK</p>

<p><i class="fa fa-birthday-cake fa-fw w3-margin-right w3-text-theme"></i> April 1, 1988</p>

</div>

<br>

<button onclick="myFunction('Demo1')" class="w3-button w3-block w3-theme-l1 w3-left-align"><i class="fa fa-circle-o-notch fa-fw w3-margin-right"></i> My Groups</button>

</div>

<button onclick="myFunction('Demo2')" class="w3-button w3-block w3-theme-l1 w3-left-align"><i class="fa fa-calendar-check-o fa-fw w3-margin-right"></i> My Events</button>

<p>Some other text..</p>

</div>

<button onclick="myFunction('Demo3')" class="w3-button w3-block w3-theme-l1 w3-left-align"><i class="fa fa-users fa-fw w3-margin-right"></i> My Photos</button>

<br>

</div>

</div>

</div>

</div>

</div>

</div>

<br>

<p>Interests</p>

<p>

<span class="w3-tag w3-small w3-theme-d4">W3Schools</span>

<span class="w3-tag w3-small w3-theme-d3">Labels</span>

<span class="w3-tag w3-small w3-theme-d2">Games</span>

<span class="w3-tag w3-small w3-theme-d1">Friends</span>

<span class="w3-tag w3-small w3-theme">Games</span>

<span class="w3-tag w3-small w3-theme-l1">Friends</span>

<span class="w3-tag w3-small w3-theme-l3">Design</span>

<span class="w3-tag w3-small w3-theme-l5">Photos</span>

</p>

</div>

<br>

</span>

<p>People are looking at your profile. Find out who.</p>

</div>

</div>

<h6 class="w3-opacity">Social Media template by w3.css</h6>

<p contenteditable="true" class="w3-border w3-padding">Status: Feeling Blue</p>

</div>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

</div>

</div>

<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i> Comment</button>

</div>

<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i> Comment</button>

</div>

<h4>Angie Jane</h4><br>

<button type="button" class="w3-button w3-theme-d2 w3-margin-bottom"><i class="fa fa-comment"></i> Comment</button>

</div>

</div>

<p>Upcoming Events:</p>

<p><strong>Holiday</strong></p>

<p>Friday 15:00</p>

</div>

<br>

<p>Friend Request</p>

</div>

</div>

<br>

</div>

<br>

</div>

</div>

</div>

</div>

<br>

<h5>Footer</h5>

</footer>

<p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a></p>

</footer>

// Accordion

function myFunction(id) {

var x = document.getElementById(id);

if (x.className.indexOf("w3-show") == -1) {

x.className += " w3-show";

x.previousElementSibling.className += " w3-theme-d1";

} else {

x.className = x.className.replace("w3-show", "");

x.previousElementSibling.className =

x.previousElementSibling.className.replace(" w3-theme-d1", "");

}

// Used to toggle the menu on smaller screens when clicking on the menu button

function openNav() {

var x = document.getElementById("navDemo");

if (x.className.indexOf("w3-show") == -1) {

x.className += " w3-show";

} else {

x.className = x.className.replace(" w3-show", "");

}

</script>

</body>

</html>

Click here to edit at w3schools.com

Sololearn Courses

2019-02-03T14:15:00.000-08:00

*Featured Code Created by 👑 Natanael Kumentas 👑

SOLOLEARN - COURSES SOLOLEARN
COURSES

C++ Tutorial

No prior programming experience is necessary! Our C++ app will supply you with everything you need to create and compile your own programs.

We guarantee that learning with SoloLearn is fast, effective, and fun. This app will show you how easy it is to become a programmer.

Learn C++ includes over 80 lessons that cover basic concepts, data types, arrays, pointers, conditional statements, loops, functions, classes,and objects. Unlock new levels, take quizzes, collect points, and compete with peers from around the world.

Most importantly, learn while having fun, because being engaged when learning makes all difference in the world.

Start Learning

Python 3 Tutorial

Learn Python in the most social and fun way, with SoloLearn!

Learn Python, one of today's most in-demand programming languages on-the-go, while playing, for FREE! Compete and collaborate with your fellow SoloLearners, while surfing through short lessons and fun quizzes. Practice writing Python code within the app, collect points, and show off your skills.

When you complete the course, you'll win a Certificate of Completion as a trophy!

So don’t wait; dive right in! Start coding with Python!

Start Learning

Java Tutorial

SoloLearn's Learn Java is a comprehensive guide to one of the most popular programming languages in the world. And here's a big bonus: Learn Java is FREE!

The Learn Java lessons are fast, easy, and effective; the app is set up so that you can complete the work in less than three hours. No prior programming experience is needed.

Once you have completed the course, you will have learned object-oriented Java programming and have the ability to write clear and valid code in almost no time at all.

So don't hesitate. Begin our step-by-step tutorial today, and learn a new skill!

Become a Java developer – start SoloLearn's FREE tutorial today!!

Unlock levels, collect points, and compete with your peers around the world. Learn and have fun with SoloLearn!

Start Learning

JavaScript Tutorial

Learn all of the fundamentals of JavaScript, and have fun while doing it – with SoloLearn!

This tutorial covers all basic features of JavaScript programming, including ways to make your website more interactive, create change website content, validate forms, create cookies, and so much more.

Go through our carefully selected instructional lessons, then take interactive quizzes while exploring checkpoints.

Our collection of exercises and hands-on practice sessions guide you as you work through the process of creating your own JavaScript code.

So be entertained and have some fun while completing this course. At the same time, you have the opportunity to collect colorful points and compete with other players from all over the world!

Further your career – or simply gain a new skill – while playing along with SoloLearn’s engaging JavaScript Tutorial.

Start Learning

C# Tutorial

The SoloLearn C# course makes the 10th programming language available to our community for FREE!

Learn Gain an understanding of C# concepts by going through short interactive texts and follow-up fun quizzes. Topics include: variables, conditional statements and loops, methods, classes, arrays, strings, encapsulation, inheritance, polymorphism, interfaces, exceptions, generics, and more!

Code Playground The best way to learn to code is to CODE! Our beautifully designed code editor lets you make changes to existing code or write and run your own custom code and see the output on your mobile device! You can code while going through the core lessons or as a stand-alone learning activity. The more you play, the better you get!

Use our Discussion Forums Whether you need additional help in understanding a topic or want to contribute to enhance the learning of peer SoloLearners, go to our Discussion Forums. Learn, share your knowledge, and improve your career and life choices!

Start Learning

PHP Tutorial

Learn PHP is finally available! Continue your FREE SoloLearn web development training today, by learning the most widely used web programming language in the world!

PHP enables you to create dynamic web pages, develop websites, and generate dynamic content. You’ll also be able to open files; write content to files; and create contact forms, forums, blogs, picture galleries, surveys, social networks, and a whole lot more.

If you are already familiar with HTML, CSS, and JavaScript, you can dive right in!

Become a programmer the easy way! And don’t forget to have fun, and at the same time strengthen your profile, unlock new achievements, and open new and even more interactive levels – today!

Start Learning

Swift 4 Fundamentals

Hands-on practice: Collect points by writing real-life Swift code within the app. Most importantly - and most fun: SoloLearn's Swift app lets you apply your newly gained knowledge and create your own, fully functioning iOS app! While no prior experience is required, we do recommend that you have some basic knowledge of programming in order to enjoy the full benefits of the course.

We cover Swift's basic concepts, control flow, collections, functions, closures, object-oriented programming, and much more!

Start Learning

Ruby Tutorial

Learn Ruby in the most social and fun way, with SoloLearn!

Learn Ruby, one of today's most beautiful, artful and yet handy and practical programming languages on-the-go for FREE! Compete and collaborate with your fellow SoloLearners, while surfing through short lessons and fun quizzes. Practice writing Ruby code within the app, collect points, and show off your skills.

When you complete the course, you'll win a Certificate of Completion as a trophy!

So don’t wait; dive right in! Start discovering Ruby!

Start Learning

jQuery Tutorial

Learn jQuery in the most social and fun way, with SoloLearn!

If you’ve already completed our HTML, CSS, and JavaScript apps, dive right in and learn even more as you compete and collaborate with your fellow SoloLearners. Improve your coding ability as you surf through brief lessons and take fun quizzes. Practice writing JQuery code within the app, collect points, and show off your skills!

When you complete the course, you'll receive a Certificate of Completion as a trophy!

The SoloLearn Learn JQuery Course covers the following topics:

AttributesContent and CSS ManipulationsDOMEventsEffectsAnimationsAnd more!

Learn and practice what you’ve learned to become a Web Development Pro! Good luck!

Start Learning

HTML Fundamentals

Interested in learning how to design a website using HTML tags, elements, and attributes? Then this learning game is for you!

Our interactive HTML tutorial is comprised of carefully selected content, quizzes, and checkpoints to ensure that you learn as much as possible, while also having as much fun as possible. This is accomplished through a series of entertaining exercises, along with plenty of hands-on practice in writing actual HTML code.

You will also learn the fundamentals of web design, collect colorful points, and compete with other learners throughout the world.

Our lessons are informative and concise, our checkpoints are enjoyable, and your learning is guaranteed. Learn while playing and play while learning with our HTML Tutorial! Whether you want to further your career or simply gain a new skill, this tutorial will work for you.

Start Learning

CSS Fundamentals

Our CSS tutorial is a learning game that will teach you how to set and control the style and layout of a website.

Go through carefully selected content, take the interactive quizzes, accumulate checkpoints, complete entertaining exercises, collect colorful points, and practice filling out actual CSS templates. Whether you want to gain a new skill to further your career, or just want to learn something new, we guarantee that you will enjoy learning while playing and playing while learning with our CSS tutorial!

Start Learning

SQL Fundamentals

Learn and practice SQL immediately, with SoloLearn’s FREE SQL tutorial!

Create, access, and manipulate databases. At the same time, collect points, unlock levels and achievements, and compete with other learners from around the world!

Whether you want to become the next greatest database designer, or you would simply like to have the ability to query databases from code, SoloLearn will take you through the fundamentals of SQL in a highly interactive, rapid, and effective manner.

Become an expert the easy – and FUN – way! Keep on playing while learning for FREE with SoloLearn!

Start Learning

Created by : 👑 Natanael Kumentas 👑
Original Code Supported by : SOLOLEARN

Thank You for Visiting

If you wish, give an upvote for this code

Sololearn Courses : Click Here

© Copyright 2018. All rights reserved.

My Codes :

Play Store
Asian Games
Sololearn Courses
My Profile

Click here to view this Code via Sololearn

Free CSS Responsive Grid Template 1

2019-02-03T11:40:00.000-08:00

CSS Grid Template 1

Source Code

<!doctype html>
<title>CSS Grid Template 1</title>
<style>
body {
display: grid;
grid-template-areas:
"header header header"
"nav article ads"
"nav footer footer";
grid-template-rows: 80px 1fr 70px;
grid-template-columns: 20% 1fr 15%;
grid-row-gap: 10px;
grid-column-gap: 10px;
height: 100vh;
margin: 0;
}
header, footer, article, nav, div {
padding: 1.2em;
background: gold;
}
#pageHeader {
grid-area: header;
}
#pageFooter {
grid-area: footer;
}
#mainArticle {
grid-area: article;
}
#mainNav {
grid-area: nav;
}
#siteAds {
grid-area: ads;
}
/* Stack the layout on small devices/viewports. */
@media all and (max-width: 575px) {
body {
grid-template-areas:
"header"
"article"
"ads"
"nav"
"footer";
grid-template-rows: 80px 1fr 70px 1fr 70px;
grid-template-columns: 1fr;
}
}
</style>
<body>
<header id="pageHeader">Header</header>
<article id="mainArticle">Article</article>
<nav id="mainNav">Nav</nav>
<div id="siteAds">Ads</div>
<footer id="pageFooter">Footer</footer>
</body>

Click here to edit on quackit.com

Free Analytics Website Template

2019-02-03T11:30:00.000-08:00

Free Analytics Template by w3

"W3.CSS Website Templates

We have created some responsive W3.CSS website templates for you to use.

You are free to modify, save, share, and use them in all your projects."

Source Code

<!DOCTYPE html>

<html>

<title>W3.CSS Template</title>

<style>

html,body,h1,h2,h3,h4,h5 {font-family: "Raleway", sans-serif}

</style>

</div>

</div>

<span>Welcome, <strong>Mike</strong></span><br>

</div>

<hr>

<h5>Dashboard</h5>

</div>

<a href="#" class="w3-bar-item w3-button w3-padding-16 w3-hide-large w3-dark-grey w3-hover-black" onclick="w3_close()" title="close menu"><i class="fa fa-remove fa-fw"></i> Close Menu</a>

<a href="#" class="w3-bar-item w3-button w3-padding w3-blue"><i class="fa fa-users fa-fw"></i> Overview</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-eye fa-fw"></i> Views</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-users fa-fw"></i> Traffic</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-diamond fa-fw"></i> Orders</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-bank fa-fw"></i> General</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-history fa-fw"></i> History</a>

<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-cog fa-fw"></i> Settings</a><br><br>

</div>

</nav>

<h5><b><i class="fa fa-dashboard"></i> My Dashboard</b></h5>

</header>

</div>

<h4>Messages</h4>

</div>

</div>

<h4>Views</h4>

</div>

</div>

<h4>Shares</h4>

</div>

</div>

<h4>Users</h4>

</div>

<h5>Regions</h5>

</div>

<h5>Feeds</h5>

<tr>

<td>New record, over 90 views.</td>

</tr>

<tr>

<td>Database error.</td>

</tr>

<tr>

<td>New record, over 40 users.</td>

</tr>

<tr>

<td>New comments.</td>

</tr>

<tr>

<td>Check transactions.</td>

</tr>

<tr>

<td>CPU overload.</td>

</tr>

<tr>

<td>New shares.</td>

</tr>

</table>

</div>

<hr>

<h5>General Stats</h5>

<p>New Visitors</p>

</div>

<p>New Users</p>

</div>

<p>Bounce Rate</p>

</div>

<hr>

<h5>Countries</h5>

<tr>

<td>United States</td>

</tr>

<tr>

</tr>

<tr>

<td>Russia</td>

</tr>

<tr>

<td>Spain</td>

</tr>

<tr>

<td>India</td>

</tr>

<tr>

<td>France</td>

</tr>

</table><br>

<button class="w3-button w3-dark-grey">More Countries <i class="fa fa-arrow-right"></i></button>

</div>

<hr>

<h5>Recent Users</h5>

</li>

</li>

</li>

</ul>

</div>

<hr>

<h5>Recent Comments</h5>

</div>

<p>Keep up the GREAT work! I am cheering for you!! Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><br>

</div>

</div>

<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><br>

</div>

<br>

<h5 class="w3-bottombar w3-border-green">Demographic</h5>

<p>Language</p>

<p>Country</p>

</div>

<h5 class="w3-bottombar w3-border-red">System</h5>

<p>Browser</p>

</div>

<h5 class="w3-bottombar w3-border-orange">Target</h5>

<p>Users</p>

<p>Active</p>

<p>Interests</p>

</div>

<h4>FOOTER</h4>

<p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a></p>

</footer>

</div>

// Get the Sidebar

var mySidebar = document.getElementById("mySidebar");

// Get the DIV with overlay effect

var overlayBg = document.getElementById("myOverlay");

// Toggle between showing and hiding the sidebar, and add overlay effect

function w3_open() {

if (mySidebar.style.display === 'block') {

mySidebar.style.display = 'none';

overlayBg.style.display = "none";

} else {

mySidebar.style.display = 'block';

overlayBg.style.display = "block";

}

// Close the sidebar with the close button

function w3_close() {

mySidebar.style.display = "none";

overlayBg.style.display = "none";

}

</script>

</body>

</html>

Click here to edit at w3schools.com

Make Shapes with C++

2019-02-03T11:18:00.000-08:00

Make Diamond, Pyramid, Triangle and more with loops

*Featured Code Created By Saad Mughal

C++ Source Code

/*Printing Differnt Shapes using for loop*/
#include <iostream>
using namespace std;
void pyrmid()
{
int row, c, n = 10, temp;
//"Enter the number of rows in pyramid of stars you wish to see ";
temp = n;
for ( row = 1 ; row <= n ; row++ )
{
for ( c = 1 ; c < temp ; c++ )
cout<<" ";
/*Leaving spaces before printing * */
temp--;
for ( c = 1 ; c <= 2*row - 1 ; c++ )
cout<<"*";
/*Printing stars by calculating rows */
cout<<"\n";
/*moving to new line after printing one */
}

}
void Daimond()
{
int n = 10, c, k, space = 1;
//cout<<"n is number of rows\n";
space = n - 1;
/*here we will divide diamond in 2 parts upper and lower */
/*printing upper part*/
for (k = 1; k <= n; k++)
{
for (c = 1; c <= space; c++)
cout<<" ";
/*leaving space before printing * */
space--;
for (c = 1; c <= 2*k-1; c++)
cout<<"*";
/*printing * by calculating row no */