In this online training you will learn the basics of HTML5 game development by creating your first Mario-style platformer game. All of it using 100% free tools and frameworks!
We'll be using the Quintus HTML5 game framework, which is a lightweight yet powerful JavaScript library used to create professional 2D games. This course was created by Pablo Farias Navarro, HTML5 developer and founder of ZENVA.
What you'll learn in this course:
Creating levels for your game using the Tiled open source map editor. Loading assets in your game. Making a 2D platformer game that runs on phones, tablets, smart tvs, computers and maybe even cars! Understanding basic platformer mechanics. Implementing enemies and their behaviors. Putting it all together to create your first game!
ACCESS the FULL COURSE here: https://academy.zenva.com/product/full-stack-web-development-mini-degree/?zva_src=youtube-fullstackmd
TRANSCRIPT
What is up, everyone? Welcome to the second half of our intro to Nexus.js course. This will be focused entirely on the final project, which will be essentially a static webpage that displays some games that we have developed. So don't necessarily have to have developed these games. It's kind of like a mock webpage. So, the steps we'll take are gonna be to first create the project and add some images. We'll them import the images into the project itself and we'll work on how to display them. Then we'll build some custom display blocks to display the image, title, and description of each of the games. We'll then build up a second page that'll be used to display the specifics of a single game. Then we'll apply some Bootstrap and custom styling and finish up by masking the URL with server site support. So just to quickly recap, this is kind of what the game looks like. We've got our games page here. Three different games to choose from. And if we click on each of them, it will take us to the game itself and we can just go home. It just kind of provides a better overview of that single game. Okay, so hope you guys are very excited. I'm really excited about this project. I thought it was actually really cool developing this with Nexus.js. It's super easy and at this point, you have all the necessary tools to begin and finish off this project. So, thanks for watching. Let's get started right away by setting our project up.
Free Tutorials:
- Unity: https://gamedevacademy.org
- Phaser: https://phasertutorials.com
- Machine Learning: https://pythonmachinelearning.pro
- Web Dev: https://html5hive.org
- Android: https://androidkennel.org
- Swift: https://swiftludus.org
- VR: https://vrgamedevelopment.pro
...
https://www.youtube.com/watch?v=2UJzZxdQvCg
Access the entire course at Zenva Academy http://lounge.zenva.com/product/programming-for-entrepreneurs-javascript/?zva_src=youtube
In this JavaScript tutorial we cover using simple arithmetic operations. JavaScript allows you to carry out all sorts of complex calculations in your webapps.
If you like this video feel free to join the course for free and download the source code files. As part of the course, we build a prototype of a dating app using JavaScript.
JavaScript is the entry point for building interactive websites, HTML5 mobiles apps and games, and server-side applications so it's very much worth learning.
This course was created by ZENVA (http://zenva.com), feel free to enrol for free at the Zenva Lounge (http://lounge.zenva.com) and to subscribe to our YouTube channel. We have free and premium tutorials on HTML5, game development, web development and app development.
...
https://www.youtube.com/watch?v=OlQU_BIsV0s
ACCESS the FULL COURSE here: https://academy.zenva.com/product/full-stack-web-development-mini-degree/?zva_src=youtube-fullstackmd
TRANSCRIPT
What's up everyone, and welcome to our tutorial on installing Next.js. Before we can learn how to use it, we should probably obtain the software and get ourselves set up with a new practice project. So what do we need to get started? We can think of these as being prerequisites. For starters, we'll need a text editor. This is gonna be some way to write code. I'm gonna use Sublime Text, although feel free to use whichever one works best for you, that's notepad or notepad plus plus or sublime, either one works. We'll need some way to run Unix commands as well. For those of you who using Mac or Linux, this'll be the terminal and for you Windows users, this'll be Command prompt or PowerShell. And we'll also need Node.js functionality installed. So I'm kind of assuming you have all three of these things. If not, then please get yourself set up with them before continuing. How do we then go about installing Next.js? Well, one of the best things about this is that there's actually no need to download any bulky packages. We simply start a new npm project, install react functionality through a couple of command line commands, and then we add a script to package.json and then finally, create a pages directory and that will be the project fully set up. So what are we going to do in this tutorial here? Well, we'll actually just install our Next.js functionality and get ourselves set up. We'll first create a new project directory, install that react to next on functionality, and then create the pages directory. So let's head on over to terminal right now. Make sure you have this up and running. This is again for you Windows users, gonna be Command prompt or PowerShell. You'll probably want to run that as an administrator. And for those of you who are using Macs or Linux, if you are running into difficulties with your commands, just try running sudo in front of them. Okay, so for starters, we need to make a project directory. I'm gonna show you in Finder where I'll put mine. There's gonna be under desktop Zenva, Next.js under course and I'm gonna pass it right here. It'll just be called something like practice because we'll be using this just over the next few sections to learn about Next.js. So I'm gonna first navigate to that location here. Zenva ... Then I want to go to next, then I want to go to courses or course. Okay, ls should confirm that there's nothing in here. So let's just clear that off. Okay. So the first thing we want to do is make a directory. I'm gonna call mine again Practice and I'm going to cd to that Practice and then I'm going to initialize npm. So I'm gonna do npm in it with the white tag and that wi
...
https://www.youtube.com/watch?v=0JOBc9WsI4c
ACCESS the FULL COURSE here: https://academy.zenva.com/product/python-programming-mini-degree/?zva_src=youtube-pythonmdd
TRANSCRIPT
The technology around us is evolving rapidly and innovating the world we live in. To succeed in this ever-changing world, you’ll need to learn the technologies that are driving the next generation of consumer and enterprise applications.
As one of the world’s most popular programming languages, Python is the perfect choice for this sort of upskilling. It’s used in almost every industry, including game development, app development, data science, machine learning, computer vision, and more, as it enables you to write complex, data-heavy tasks both simply and quickly. Python also boasts a simple syntax that reads almost like plain English, making it easy to learn for those who have never coded before.
With the Python Mini-Degree, you’ll develop a strong foundation with the language while exploring its various practical applications, such as building multimedia games, analyzing data, and understanding the fundamentals of machine learning and the Internet of Things (IoT). You’ll also master Python’s most popular, modern frameworks, including Kivy, NumPy, and Pandas – knowledge that will make it even easier for you to expand into multiple areas of development. In addition to gaining these in-demand skills, you will also prepare several portfolio-worthy projects that are bound to impress employers and clients, ensuring that you have all you need to take on the world as a well-informed and highly prepared developer.
Free resources: https://linktr.ee/zenva
Free Tutorials:
- Coding: https://coding.degree/
- Unity: https://gamedevacademy.org
- Phaser: https://phasertutorials.com
- Godot: https://godottutorials.pro
- Machine Learning: https://pythonmachinelearning.pro
- Web Dev: https://html5hive.org
- Android: https://androidkennel.org
- Swift: https://swiftludus.org
- VR: https://vrgamedevelopment.pro
...
https://www.youtube.com/watch?v=G5RV48Hft80
ACCESS the FULL COURSE here: https://academy.zenva.com/course/jr-coder-digital-systems-academy/?zva_src=youtube-description-encryption
Learn about how any data you send over the Internet is encrypted in the most beginner-friendly way possible!
As we all send and receive information over shared connections, we need a way to protect and encode our data so that only the intended recipients will be able to access it. This is done through a process called encryption. Although we don't normally think about it, encryption is used every time that we login into websites or transfer files over the Internet. You may have noticed that most pages you visit have URLs starting with 'https', which means they are using the Transport Layer Security (TLS) protocol to encrypt the data sent to and from a website.
Cryptography is the science that takes care of encrypting and decrypting data. In computing, all information that is not yet encrypted is also referred to as plaintext, while encrypted data is known as ciphertext. Encrypting a message is nothing more than changing it in order to hide its original contents. We then decrypt it to get back the original message. This process has been used for centuries, dating back to Caesar's cipher (a simple substitution cipher) to the modern encryption algorithms that we have today that use 256-bit keys or more.
There are two types of encryption: symmetric and asymmetric. When the same key used to encrypt is also the one used to decrypt a message, we have symmetric encryption (only one key). On the contrary, for asymmetric encryption, we have different keys for encrypting and decrypting. There's a public key that can be known to everyone on the network and is used only for encryption, and a private key that is not shared (thus, kept secret) which is used to decrypt.
In this tutorial, we will get an understanding of how both sides involved in communication over the network (namely, a client and server) generate a secret session key with which they are able to communicate sensitive information securely. And no third party potentially eavesdropping on the conversation will be able to decrypt the messages exchanged. The establishment of this key happens in a sequence of steps where the client and server send each other credentials that are stored on both sides and used for the generation of the session key.
Let's now dive in to see what steps are necessary for the client and server to establish a secure session key!
...
https://www.youtube.com/watch?v=dNYOjTNAE40
ACCESS the FULL COURSE here: https://academy.zenva.com/product/build-a-full-rpg-adventure-in-phaser/
TRANSCRIPT
In this video, I'm gonna go ahead and show you how we can download and install the Tiled Map Editor. If you're not familiar, Tiled is a general purpose tile map editor, that it can be used for all tile based games. Some of these can include RPG's, platformers etc. Tiled is highly flexible, it can be used to create maps of any size, with no restrictions on the tile size or the number of layers or tiles that can be used in the map. Maps, layers, tiles and objects, can all be assigned different properties, in the Tiled editor. And then, Tiled's map format is easy to understand and allows you to have multiple tile sets. And inside any map. Another benefit is, all your tile sets can be modified at any time. So you can change them for your level. So, to download Tiled, go ahead in your browser, go ahead and go to mapeditor.org, and you should be taken to the Tiled screen. And then go and click on Download at itch.io. You'll be then taken here, where you can download the editor. So, Tiled is supported on a variety of platforms, I'm currently using a Mac, so I'll be downloading that version. So go ahead and click on the Download Now button. So, Tiled is free to use and it is opensource. However, if you'd like to support the developer, you can go ahead and enter a price here, if not you can just click, No thanks, just take me to the downloads. And this will take you to the downloads page. And then you'll wanna go ahead and choose the installer for your operating system. So like I said I'm on Mac, so I'm gonna go ahead and download the Tiled for Mac. So this will go ahead and start downloading your file. Once it's downloaded, we just need to unzip the zip folder. And this will be application. So on Mac, we'll go ahead and drop this into our applications folder, and then Windows, you'll probably wanna put this in your programs folder. So once you have the application, if you go ahead and double-click on it, it'll open up Tiled. And you'll be taken to this screen here.
Free Tutorials:
- Unity: https://gamedevacademy.org
- Phaser: https://phasertutorials.com
- Machine Learning: https://pythonmachinelearning.pro
- Web Dev: https://html5hive.org
- Android: https://androidkennel.org
- Swift: https://swiftludus.org
- VR: https://vrgamedevelopment.pro
...
https://www.youtube.com/watch?v=SvXkM7QLyCc
ACCESS the FULL COURSE here: https://academy.zenva.com/product/python-programming-mini-degree/?zva_src=youtube-description-oopwithpython
Learn how to use classes and objects to represent real-world entities in Python!
Object-oriented programming (OOP) structures a program into classes that have a particular set of properties and behaviors. A class is nothing more than a blueprint for creating objects, which lists the fields or attributes (properties) and methods (behaviors) that its instantiated objects will contain. We can use classes to implement advanced concepts such as encapsulation, abstraction, inheritance, and polymorphism.
The whole notion of the OOP is focused on creating reusable and easily-adaptable code. We can think of the fields of a class as simply being variables that store values known only to the object of that class, and in this way, we can always just add or remove attributes from it. Similarly, methods are used to determine the behavior of an object of the class by accessing and altering its fields. Other parts of the code that need access to this information will do so by calling for the object's methods, which are functions that can, in turn, handle such values.
In this short tutorial, we're going to define a GameObject class in Python and set its fields and methods. You'll learn how to initialize the fields of the class by calling on a special method known as initializer (specified by the __init__ keyword). The initializer's only purpose is to set up the object's attributes as soon as the object is created. We'll also cover the specifics of the Python language when it comes to the parameters of the class methods and how to properly format strings.
When working with object-oriented programming languages, such as Python, you'll know exactly where to look when something doesn't go as expected. Instead of having to review your entire code and debug it for hours on end to try and mitigate the problem, you can go looking for the class related to the issue you're having directly and examine it locally instead. That's why knowing how to use classes and objects to better structure your code is a key ability when dealing with large projects or bringing your own projects to the next level!
...
https://www.youtube.com/watch?v=hY3bSrOeOF4
Access the full course here: https://academy.zenva.com/product/full-stack-web-development-mini-degree/?zva_src=youtube-fullstackmd
Learn about the Document Object Model (DOM) and how it gives you the power to develop interactive web pages and dynamic widgets powered by JavaScript and HTML5.
Access +100 programming courses in Zenva: https://academy.zenva.com/?zva_src=youtube
Our tutorial blogs:
GameDev Academy: https://gamedevacademy.org
HTML5 Hive: https://html5hive.org
Android Kennel: https://androidkennel.org
Swift Ludus: https://swiftludus.org
De Idea A App: https://deideaaapp.org
Twitter: @ZenvaTweets
...
https://www.youtube.com/watch?v=5v91-Oq5CGA
Thanks to the generous support of Intel and Microsoft, we have been able to work for already 6 weeks in Zenva Sky – the world’s first app to teach coding in a virtual reality environment. The road has certainly been challenging – we’ve had to invent the whole wheel as this has not been done before, but that is also what’s been the most exciting about this journey.
As we shared in our weekly updates, finding the right mechanics for this educational experience took some fine-tunning. Once we found the right system we moved on to implementing core features and demo content that covers some of the computer science and coding concepts we want to teach.
We are currently in an early to mid alpha stage, still implementing some of the core features of the product. In terms of content, Zenva Sky has now 8 coding challenges or levels. We’ve been polishing and improving this content based on user feedback.
Expanding the set of commands
One of the things we’ve observed at Zenva is that a lot of people who are learning to code find it difficult to grasp the concepts of loops or iterations, so that was our main focus this week.
So far, Zenva Sky offers the following commands to the user, who can use them to code a robotic vehicle and complete challenges:
- Move (in straight line)
- Rotate 90 degrees to the left or right
- Activate adjacent Boolean switches (to unlock Boolean gates)
We’ve now also added the ability to create basic loops, where one or more commands can be repeated multiple times.
Looping commands
To illustrate how loops work in Zenva Sky we created two new levels which can only be solved by using such elements.
Level 7 could be solved in theory by using two commands: Move and Rotate. The player would move one cell, then rotate, then move, and so forth.
The problem with this approach other than the fact that it is very repetitive is that the number of commands needed to solve the challenge in that manner is greater than the limited space programs in Zenva Sky can have.
Level 7 can also be solved by repeating the following 4 times:
1) Move
2) Rotate left
3) Move
4) Rotate right
These buttons are pressed with hand-tracked controllers.
Combining loops and Boolean gates
In order to illustrate how this system can be combined with the different interactive elements we have already developed, we created a coding challenge which can only be solved with loops which incorporates Boolean switches connected to doors that open when the switch is activated.
This could be easily extended to use some of the gates we’ve already implemented (AND, OR and XOR).
...
https://www.youtube.com/watch?v=qTKP4lS9dO8