Responsive Website Tutorial and Examples (Coursera)

Responsive Website Tutorial and Examples (Coursera)

In this course, we will show you exciting examples of collaborative, interactive web applications that use various types of media including sound, images and big data. We will show you how to build sites that provide precisely this functionality, using Meteor. We will also provide fully working example application code that you can use for your own commercial web projects. The course also provides a range of advice and suggestions about how to develop bespoke web applications which match the requirements of clients, where clients are people who commission the product or people who use the product.

Class Deals by MOOC List - Click here and see Coursera's Active Discounts, Deals, and Promo Codes.

We will take you through the development of the following applications:

  1. A portfolio website with collaborative blogging functionality.
  2. An interactive, realtime, multi user music remixing system.
  3. An interactive, online graffiti wall where users can collaborate to create graphics.
  4. An interactive data visualisation platform for exploring and plotting big data in exciting ways.

At the end of this course, you will be able to:
• Implement animated data visualisations and graphics using advanced user interface libraries such as vis.js
• Work with external data sources
• Create multi user, realtime, collaborative environments
• Use media APIs such as the Web Audio API
Participation in or completion of this online course will not confer academic credit for University of London programmes.

Course 5 of 6 in the Responsive Website Development and Design Specialization

Syllabus

WEEK 1
Responsive Website Tutorials and Examples outline: Course overview
Creating a Portfolio Website with a Blog
Welcome to the first module of 'Responsive Website Tutorial and Examples!'. In this session we will be exploring a real-world web development task based on a common brief that web developers have to respond to every day – producing a portfolio website with both static and dynamic content features. I hope you enjoy the module! -Mick

WEEK 2
Collaborative Apps 1 : Music Machine
Welcome to the second module of 'Responsive Website Tutorial and Examples!'. Meteor is great at making collaboration simple. You can make collaborative sites in a day or so that work across many devices including mobile. By the end of this session you will understand how to structure and build collaborative, real-time applications, how to integrate the web audio API, and how to specifically set and get variables stored in the database using basic interface elements.

WEEK 3
Collaborative Apps 2 : Drawing Machine
Welcome to the third module of 'Responsive Website Tutorial and Examples!'.Meteor allows us to make creative, collaborative apps that work in real-time. Both the Client and the Server can insert information into a Mongo collection. Ordinary web users can do this interactively, without having to program the database manually. In this session we will look at this approach through the lens of collaborative drawing. You will learn how to create a canvas using d3.js, change attributes of the canvas, create client code for inserting data into the database and how to render database entries as a drawing.

WEEK 4
Creating a Data Visualisation Application
Welcome to the final module of 'Responsive Website Tutorial and Examples!'.In this session we will be looking at how to use data from external sources to create interactive visualisations for the purposes of creating an interactive data visualisation web app.

Go to Class
MOOC List is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Related Courses

Introduction to HTML5 (Coursera) Coursera
University of Michigan

Introduction to HTML5 (Coursera)

Thanks to a growing number of software programs, it seems as if anyone can make a webpage. But what if you actually want to understand how the page was created? There are great textbooks and online resources for learning web design, but most of those resources require some background knowledge. This course is designed to help the novice who wants to gain confidence and knowledge. We will explore the theory (what actually happens when you click on a link on a webpage?), the practical (what do I need to know to make my own page?), and the overlooked (I have a page, what do I do now?).

Jun 22nd 2026
3 Weeks
Accounting Data Analytics with Python (Coursera) Coursera
University of Illinois at Urbana-Champaign

Accounting Data Analytics with Python (Coursera)

This course focuses on developing Python skills for assembling business data. It will cover some of the same material from Introduction to Accounting Data Analytics and Visualization, but in a more general purpose programming environment (Jupyter Notebook for Python), rather than in Excel and the Visual Basic Editor. These concepts are taught within the context of one or more accounting data domains (e.g., financial statement data from EDGAR, stock data, loan data, point-of-sale data).

Jun 22nd 2026
5-12 Weeks
Foundations of Objective-C App Development (Coursera) Coursera
University of California, Irvine

Foundations of Objective-C App Development (Coursera)

An introduction to the Objective-C programming language. This will prepare you for more extensive iOS app development and build a foundation for advanced iOS development topics. Objective-C programming requires a Mac laptop or desktop computer. An iOS device is optional if the learner is willing to working exclusively with the simulator. Some learners have been able to work with an OS X virtual machine on Windows, but explaining how to do that is beyond the scope of this course.

Jun 22nd 2026
4 Weeks
Advanced Styling with Responsive Design (Coursera) Coursera
University of Michigan

Advanced Styling with Responsive Design (Coursera)

It used to be the case that everyone viewed webpages on about the same size screen. But with the explosion of the use of smartphones to access the Internet, the landscape of design has completely changed. People viewing your site will now expect that it will perform regardless of the platform (smartphone, tablet, laptop, or desktop computer). This ability to respond to any platform is called responsive design.

Jun 22nd 2026
4 Weeks
Introduction to CSS3 (Coursera) Coursera
University of Michigan

Introduction to CSS3 (Coursera)

The web today is almost unrecognizable from the early days of white pages with lists of blue links. Now, sites are designed with complex layouts, unique fonts, and customized color schemes. This course will show you the basics of Cascading Style Sheets (CSS3). The emphasis will be on learning how to write CSS rules, how to test code, and how to establish good programming habits.

Jun 22nd 2026
4 Weeks
Data Science with R - Capstone Project (Coursera) Coursera
IBM

Data Science with R - Capstone Project (Coursera)

In this capstone course, you will apply various data science skills and techniques that you have learned as part of the previous courses in the IBM Data Science with R Specialization or IBM Data Analytics with Excel and R Professional Certificate. For this project, you will assume the role of a Data Scientist who has recently joined an organization and be presented with a challenge that requires data collection, analysis, basic hypothesis testing, visualization, and modeling to be performed on real-world datasets.

Jun 22nd 2026
5-12 Weeks
Foundations for Interviewing with Confidence (Coursera) Coursera
Salesforce,SV Academy

Foundations for Interviewing with Confidence (Coursera)

This is Course 2 in the Salesforce Sales Development Representative Professional Certificate. In order to successfully complete the course, please ensure you have taken Course 1: Groundwork for Success in Sales Development. The goal of this course is to prepare you to build your professional tech sales portfolio, and develop and leverage your personal and professional brand.

Jun 22nd 2026
4 Weeks
Data Analysis Using Python (Coursera) Coursera
University of Pennsylvania

Data Analysis Using Python (Coursera)

This course provides an introduction to basic data science techniques using Python. Students are introduced to core concepts like Data Frames and joining data, and learn how to use data analysis libraries like pandas, numpy, and matplotlib. This course provides an overview of loading, inspecting, and querying real-world data, and how to answer basic questions about that data. Students will gain skills in data aggregation and summarization, as well as basic data visualization.

Jun 22nd 2026
3 Weeks
How To Create a Website in a Weekend! (Project-Centered Course) (Coursera) Coursera
The State University of New York

How To Create a Website in a Weekend! (Project-Centered Course) (Coursera)

In this project-centered course*, you’ll design, build, and publish a basic website that incorporates text, sound, images, hyperlinks, plug-ins, and social media interactivity. We’ll provide you with step-by-step instructions, exercises, tips, and tools that enable you to set up a domain name, create an attractive layout for your pages, organize your content properly, ensure that your site functions well across different operating systems and on mobile devices, keep your site safe, and finally, let people know your site is online. We’ll even show you how to track your visitors.

Jun 22nd 2026
3 Weeks
Fundamentos de Excel para Negocios (Coursera) Coursera
Universidad Austral

Fundamentos de Excel para Negocios (Coursera)

Cuando finalices este curso habrás logrado un gran número de habilidades como introducir información, ordenarla, manipularla, realizar cálculos de diversa índole (matemáticos, trigonométricos, estadísticos, financieros, ingenieriles, probabilísticos), extraer conclusiones, trabajar con fechas y horas, construir gráficos, imprimir reportes y muchas más.

Jun 22nd 2026
5-12 Weeks
Data Visualization with Advanced Excel (Coursera) Coursera
PwC

Data Visualization with Advanced Excel (Coursera)

In this course, you will get hands-on instruction of advanced Excel 2013 functions. You’ll learn to use PowerPivot to build databases and data models. We’ll show you how to perform different types of scenario and simulation analysis and you’ll have an opportunity to practice these skills by leveraging some of Excel's built in tools including, solver, data tables, scenario manager and goal seek.

Jun 22nd 2026
4 Weeks
Foundations of User Experience (UX) Design (Coursera) Coursera
Google

Foundations of User Experience (UX) Design (Coursera)

Foundations of User Experience (UX) Design is the first of a series of seven courses that will equip you with the skills needed to apply to entry-level jobs in user experience design. UX designers focus on the interactions that people have with products like websites, mobile apps, and physical objects. UX designers make those everyday interactions usable, enjoyable, and accessible. The role of an entry-level UX designer might include empathizing with users, defining their pain points, coming up with ideas for design solutions, creating wireframes, prototypes, and mockups, and testing designs to get feedback.

Jun 25th 2026
4 Weeks