A Primer For Web Development In Python

If you haven’t already completed the first four parts of this five-part Python Series, check them out here:

1. Python Level 1 – Beginner

2. Progressing In Python – Level Intermediate

3. Learning Python – Advanced Level

4. Django Unchained – Learn and Master Django

In this post, I will cover the topics that you need to have an overall knowledge of, in order to master web development using Python.

You need to learn the following topics – and if the following order doesn’t work, you can try things at random and see how things work out for you.

1. Learning How The Web Works:

You have to learn how the web works before you can venture on your journey to develop web related apps, sites, etc. So, the first basic thing you need to cover is gaining the knowledge related to how the web actually works.

You can use the following resources to get to know these web related basics.

a. Web Development Course On Udacity

These video lectures will explain the basic concepts of the web that you need to familiarise yourself with before you start developing stuff. These videos will cover in detail – the concepts of server, protocols, HTTP Request/Response, Client-Server working mechanism, User Agents, and a little introduction to HTML also. This will be the best place to start. You can also access the Course Materials here if you find that you know most of these and that you only need to brush the basics.

b. Build your first web-page

You can follow this Udacity course project to get a good introduction to the practical aspect of the things that you have learnt in the tutorial above.

c. Tutorials Point – Web Basics

Additionally, you can use these Tutorials Point articles to familiarise yourself with the basics of Web Development.

2. Front End Related Topics:

In any web application, website or anything web related – there are two basic layers. The top layer is what we see as the web interface that we interact with, in order to get things done – the user interface. The bottom layer is the logic and functions that go on behind the screens to carry out the functionalities that we intend to extract out of our interaction with the interface – the backend.

Here, you need to get really good at the following topics to be well able to handle the development of front end all by yourself.

a. HTML/CSS:

The web is powered by HTML language, like literally. Without HTML we won’t have the World Wide Web, coz HTML is what web-pages are made of.
Just HTML alone won’t be much useful in the multimedia age now. We need to style the pages in order to make them presentable. That’s where CSS comes in like a boss. Without CSS, all the web-pages will be just bland text and stuff.

So, to learn HTML/CSS, follow these resources.

Web Development on Udacity – HTML basics

This tutorial will provide you the basics of HTML. You will be good to go from here, but you will have to do in-depth study of HTML and it will surely be helpful, the reason for which you will only understand when you start development related activities.

HTML/CSS track in CodeAcademy

Code academy is a great place to start learning the basics of most of the programming languages and they have especially done a great job with respect to the HTML/CSS track.

HTML

This is one of the best books to learn and master HTML and CSS. You will find this book as more than just a useful reference. You can do yourself a favor, stick with this book and learn the stuff in this book inside out and you won’t need anything else.

W3Schools HTML Tutorials and W3Schools CSS Tutorials

These are the two places on the web that will serve as the best reference to assist you when it comes down to HTML and CSS.

b. Javascript:

The interactivity in websites is partly done with the help of Javascript. This is the one important thing that makes websites rich and interactive. Knowing javascript will prove to be a great leverage in your web development journey when compared to those that don’t know it. You can do a wide array of things with javascript and you can’t even imagine the capabilities of this technology now. But you will understand what you can accomplish with javascript alone, as you progress through this journey.

Javascript RoadTrip Part 1 – Course on CodeSchool

This is a pretty comprehensive beginners course for javascript. This will get you started.

JQuery Course on CodeSchool

Completing this course will give you the essential knowledge of jQuery. jQuery is nothing but a library of functions written in javascript which you can just import instead of writing from scratch, for most commonly used functionalities. Knowledge of what capabilities this library offers you will take you a long way in minimizing your work and maximizing your output in web-development for the front end.

If you want to go a bit further and master javascript, you can use the following resources to accomplish that.

Javascript Beginners course on Udacity

This is the best place to start learning javascript if you ask me. This course is very comprehensive with a lot of attention to detail. You will learn a lot in this course and if you do the course project, you will find yourself learning more practically than you’d learn theoretically from videos and texts.

Introduction To jQuery – Udacity

This again, is a pretty comprehensive course on jQuery and you will find yourself learning a lot by doing the course projects given in this course. These two courses will be a great place to start.

Javascript Design Patterns

Now, you might ask what’s the point of learning design patterns in Javascript for front end development. But this will take you just a bit further from where you already are, in terms of Javascript knowledge. Learning design patterns will also give you a leverage when you need to code advanced functionalities in javascript.

JavaScript and jQuery: Interactive Front-End Web Development

This is one of the best books out there for learning Javascript & jQuery. You can use this book as a reference or you can start off with this book and learn a great deal from scratch. Choose the one that best suits your needs and taste.

Note:

Use JSFiddle tool to code HTML, CSS, and Javascript online in three tabs and see the output in the fourth. The window is divided into four in which three windows will be filled with code and the fourth window will show output. This is a very helpful tool for noobs.

c. Twitter BootStrap:

Twitter Bootstrap CSS library is one of the most popular CSS libraries used for responsive web design. You just need to add the css file to your development folder and include the appropriate classes to give a responsive design to the front end.

3. Back-End Development:

Back-end consists of the logic written in order to take care of the functionalities that go on behind the screens when we interact with the interface.

a. Python:

Here, in this context, the back-end language is Python.

We have covered the topics and resources for Python and Django in the last four parts of this series. Check out those four parts here.

Python Level 1 – Beginner

Progressing In Python – Level Intermediate

Learning Python – Advanced Level

Django Unchained – Learn and Master Django

Use these resources to master Python and Django, which I suppose you already did.

b. Databases:

Most modern applications, websites have to use some place to store all the incoming and outgoing data. The websites also have to store a lot of content, if it’s a blog kind of a setup. So, to store data, we use databases.

You can use the following resources to learn all about databases and become a master manipulator of databases.

Coursera Stanford Course on Databases

This is the best course to start with – Stanford University’s offering in Coursera contains all you need to know about Databases and database management systems.

Zetcode’s MySQL tutorial

There are many options for you, but MySQL is great to start with, since it is almost similar to SQL and also because it is open-source. This tutorial is very detailed and will take you a long way in MySQL programming.

Udacity’s Introduction To Relational Databases Course

This is another alternative to the coursera course. It’s an equally detailed course that will take you from a noob to an intermediate level database programmer.

Database chapter – Web Development Course – Udacity

This is the database chapter of the web development course offered by Udacity. This will give you an overall view of the database basics that you will need to work with in order to do basic database programming.

c. APIs:

When you have the most important functions or capabilities already written by someone else, you don’t have to code from scratch. Most often, you can use such pre-written code and accommodate it into the web application or the website you develop and these are called as Application Programming Interfaces or APIs. Having the knowledge of how APIs work and how you can tweak the features they offer in order to build whatever you want to build will give you a much needed advantage in deciding the time and cost of the project you take up.

The following resources will give you a good handle on APIs.

Introduction to APIs Video

This video will teach you what APIs are, what you can do with them and why you should bother about these API thingy.

Web Development on Udacity – APIs

This Udacity Web Development course’s chapter on APIs will give you all the basic knowledge about the world of APIs and then you can begin to understand and take advantage of the API capabilities offered by Python.

Introduction to APIs in Python – Codeacademy

This Codeacademy track will introduce you to APIs and API programming in Python. This will get you started with respect to Python library and the APIs that it has to offer.

Coding Entrepreneurs Coding Basics of APIs in Python

This video will explain the basics of coding with APIs to grab data using Python.

List of Python APIs

This resource will give you list of all the APIs present in Python which you can use in your application/website for varied functionalities depending upon the functions and capabilities offered by those APIs.

4. Other Important Things You Should Know:

a. Chrome Developer Tools

When you have to debug your code, we all go to the source code most often. But to minimize the hassle, chrome has introduced the developer tools which will be visible when you right click on a particular page in Google Chrome. You can then view all the code involved in the front end, find the bugs and fix the errors.

Codeschool course on Developer Tools

This course on developer tools by CodeSchool will give you the essential knowledge on how to use and make the best of the Chrome’s developer tools.

Tuts+ tutorials on Chrome Developer Tools

Tuts+ courses are famous in all of their offerings. This one offers nonetheless a great course on Chrome Developer tools, one you could actually start with.

Having the knowledge of finding your way with developer tools will prove to be very useful in your career as a web developer.

b. GIT Version Control and Making The Best Use Of GitHub:

Git and GitHub are the most popular version-control based technology that the world today uses. You need to learn to do version control of the code you write in order to maintain a proper repository for the updated version changes and also to make the history of changes available for those who will access your code.

The following tutorials and courses will be very helpful for you to learn Git Version control and GitHub related stuff.

Atlassian Tutorials for Git

Code School’s Try Git – Interactive Git Learning

Guided Tour of Fundamentals of GIT

These are the things that you will need to master to be a great web-developer. This Python Series comes to a full circle now.

Note:

Share this post with your friends using the social share buttons below – just above the comments section. Also, if you have any questions or feedback, leave a comment! Your feedback and comments are most welcome!

Loading Facebook Comments ...

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>