Bills Programming Tutorials

JavaScript

JavaScript is similar in some respects to Java but it is easier to learn and a good place for beginners to start programming, or coding. In HTML5, it is a graphical programming language that is compatible with a wide range of delivery platforms including desktops, laptops and mobile devices. And it has built-in audio and video elements as well as a canvas element which makes graphical displays possible. So, to learn how to program in JavaScript you also have to learn how to code HTML and style sheets.

Here are some tutorials on JavaScript and its associated web technologies:-

HTML5 is the latest version of HTML with full graphics and audio and video capability.

Style Sheets are important as a means of styling web pages and making them attractive and consistent..

JavaScript is the means of adding dynamic functionality to a web page.

To get you started here are some examples that you can add to your own websites.

JavaScript examples , a fully functioning analog clock, a calculator, a set of bouncing balls and a board game that you can add to your own web pages. You just have to copy the JavaScript code into your web page html source code. You can modify and resize the applications any way you like.

 

Android Java

Android apps are written in two languages. One is a version of XML that is used to create user interfaces for Android mobile devices and the other is the Java code that provides the programmed action.

Java is a very widely used programming language and comes in several varieties, or frameworks. There is Java for desktops, Java for web servers, and Java for Android mobile devices. The Android framework provides the structural component classes and other helper classes in an API (an application programmers interface). These are imported into the app as required.

To develop Android applications you need another software package called a development environment. This provides all the Java classes you need and if it is an Integrated Development Environment (an IDE), it also lets you compile your source code into an executable app and test it. There are several IDEs available for Android apps of which Android Studio is the one recommended by Google, the provider of Android.

Android Studio lets you develop apps on a computer and test it on a device emulator or on a real connected device..

AIDE lets you develop apps on the Android device itself and test it on that device.

Graphics Shapes, an introduction to Android graphics and the graphics classes.

Scaled Graphics, a summary of methods of producing graphics presentations that will scale to any screen size.

Path Graphics, an introduction to the Android Path class that can be used to create complex figures.

Graphics Color, a summary of the use of color in Android graphics and computer systems generally.

I use the the Android framework to produce Android apps for educational and entertainment use. These are published under the Debden label. You can look through a summary of these apps here. Currently they are published on the Amazon App Store and the Google Play Store from which you can download them directly into your Android device. They include the following:-

Deb Draw is a useful drawing app. You can use it like a pen and paper and save the images as jpg files. There are three versions. One is a free version called Deb Draw Free. Another is the premium version called Deb Draw with a number of enhancements, and the third is the Amazon Underground version, Deb Draw Underground. This is exactly the same as the premium version but entirely free.

The Underground version is only available through the Amazon App Store but this can be downloaded from the Play Store and used in all Android devices. From the App Store you can download Amazon apps including the free Underground apps. To run underground apps you also have to download a free app from the App Store. This allows Amazon to pay developers a small commission instead of expecting them to charge for their apps or include ads. So it is a very good deal for the user.

Deb Script is an alternative way of creating images and a simple programming language in its own right. Here you create images by writing code. This teaches basic coding techniques and at the same time creates useful jpg and png images - all on a mobile decice. It too is available on Google Play Store and Amazon Underground.

Getball is a small game app that involves trying to retrieve a ball from an opposing team. It is mainly intended to illustrate my book on Android Java but is also a viable app in its own right. The idea is that you should be able to extend the app to create your own game after going through the book.

Cordova

There are several alternatives to the Android framework described above. The most popular is probably Cordova which provides an alternative to the so-called native code of Android, iOS and Windows. Cordova mobile apps are written in JavaScript and a single code base can be adapted to run in all three native environments. In addition, JavaScript is generally reckoned to be easier to learn that these native languages.

Cordova is a hybrid approach that runs as a web application in a web view component embedded in the device. It is reinforced by plugins which call native functions from Javascript so it can do everything a native app can do but it is a little slower.

The Software Installation, For beginners, the main problem with Cordova is the installation and configuration of the development environment. There are free IDEs that do the job but all have disadvantages so the best way to develop a Cordova app is from directly writing to the operating system via the command line interface, or CLI. The first task is to install the required software including Java, Node and Cordova itself. You also have to make sure the environmental paths are set to these packages so that ths CLI can find them. Overall is a fairly tedious process and you have to be careful with your typing but you only have to do it once.

Creating an App. Then you can create a new Cordova app and add the software required for Android.

Running an App. To debug your app you need to test run it in something. One possibility is a browser which will at least display the HTML. A better option is to use an emulation which will run the app in a virtual Android system. However this is usually ver slow so the easist procedure is to test the app in a connected Android device via a USB cable.

Developing an App. involves editing three files. One is an HTML file, another the CSS file and the main one is the JavaScript file. These three files represent the core of your Android app.

Adding plugns to an app enables it to do some of the things JavaScript can't do but Android Java can.

Scratch

Scratch Cat

The easiest way to learn how to code is to use the MIT Scratch programming software. You can write Scratch programs online by registering on the MIT website. Then you can share your work with a global community of Scratchers. Or, if you prefer to code offline, you can download the Scratch 2 version and upload your work to the website if and when you feel like it.

Scratch programming is easy because there is no text input required and no need to learn a complicated coding syntax. Typing errors are not a concern. Instead the Scratch programming environment lets the programmer simply drag blocks of code into position like jigsaw pieces and create a program that way. You only have to learn the logic of programming and that is transferable to other languages.

The only downside of Scratch is that your programs can only be published to the Scratch community via the MIT website or distributed to other Scratchers who have the development software installed in their computers. But you can entertain your friends and family on your own computer.

Here are some links to my tutorials. First there is an up-to-date summary here. Then there are currently five tutorials as follows:-

Introduction to Scratch - a general introduction to the Scratch development environment.

Bat and Ball application - the traditional example of Scratch animation and user interaction.

Clock application - an analog clock that shows current system time as another example of Scratch animation.

Drawing application - an app that allows the user to draw pictures on the Scratch screen and save them as JPG files.

Dodger - a game in which a cat sprite dodges falling dog sprites.

 

UML

Class diagram

Before you start programming a software application you should try to design it. This means finding out what the users would like the application to do and deciding what is the best way to give them what they want. This is a vital stage in the development of large to medium software products and is even useful for quite small applications. Good design work can save a lot of time and effort at the coding and testing stages.

Even if you are developing a relatively small JavaScript web application or an Android app you should try to anticipate who the potential users might be and what they would like the software to do. Some design work would be very useful.

The most widely used basis for object oriented software design is UML, the Unified Modeling Language. This is a formal language, mostly based on diagrams, that is now the standard tool for software development.

Requirements Analysis, the preliminary to a software design process.

Analysis and Design, Moving from the analysis stage to the design stage

UML State Diagrams, sometimes describes as state machine or statechart diagrams