Presentation is loading. Please wait.

Presentation is loading. Please wait.

INTRO TO MAKING A WEBSITE Mark Zhang.  HTML  CSS  Javascript  PHP  MySQL  …That’s a lot of stuff!

Similar presentations


Presentation on theme: "INTRO TO MAKING A WEBSITE Mark Zhang.  HTML  CSS  Javascript  PHP  MySQL  …That’s a lot of stuff!"— Presentation transcript:

1 INTRO TO MAKING A WEBSITE Mark Zhang

2  HTML  CSS  Javascript  PHP  MySQL  …That’s a lot of stuff!

3 Overview of the Overview  Accessing a website  Client-side technologies  Server-side technologies

4 Accessing a Website

5 You (client)

6 Accessing a Website You (client)Web server

7 HTTP Request You (client)Web server IP: 72.26.203.99 HTTP Request: GET www.xkcd.com

8 HTTP Response You (client)Web server IP: 72.26.203.99 HTTP Request: GET www.xkcd.com HTTP Response: web content (HTML file)

9 Browser Renders Files You (client)Web server IP: 72.26.203.99

10 Review  Client - your computer (usually by your browser)  Server – computer that stores and provides the website

11 Demo

12 Questions?

13 Client-side Technologies

14 Client Side  HTML  CSS  Javascript  These are kinds of files that a web-server can send to your computer. Your browser uses these files to render the web-page.

15 HTML  Describes the content of a web-page My Title Hello world! </body

16 CSS  Styles HTML elements p { font-size: 20px; color: red; }

17 Javascript  Adds interactivity to web-pages  Submit forms  React to mouse movement  Change HTML content (like text in a paragraph)

18 jQuery and AJAX  jQuery – Javascript with more convenient syntax  AJAX – a group of functions in Javascript that allows you to talk to a server without loading another page

19 Questions

20 Server Side Technologies

21 Server Software  Responds to HTTP requests from clients.  Apache – most common server software; taught in 6.470  Commonly run on Linux computers.  LAMP stack = Linux, Apache, MySQL, PHP

22 PHP  Allows programmer to make web pages dynamic.  Collect form data  Handle user sessions and authentication  It often does this in conjunction with a database (MySQL)  Common alternatives: Python, Ruby

23 Databases (MySQL)  Database – an organized collection of data that is maintained on the server  Account information and passwords  User-generated content (comments, posts, etc.)  MySQL is a particular database system that is commonly used with PHP.

24 PHP and MySQL  Often work together  PHP makes queries to MySQL  MySQL provides reliable storage and fast access to large amounts of data  PHP uses the content to generate a dynamic webpage

25 Additional Technologies  Web frameworks – simplify common tasks like user accounts, database access, etc.  Django  Ruby on Rails

26 Additional Technologies  Git – version control  Lets you save and rollback your work  Lets you make branches.  With Github, lets you easily collaborate with others.

27 Getting a Web Server  MIT  You can get web space on scripts with just your Athena account  http://scripts.mit.edu/ http://scripts.mit.edu/  Commercial Web Hosting  WebFaction  Bluehost  Amazon EC2 (advanced)

28 Questions?

29 Mark Zhang INTRO TO MAKING A WEBSITE


Download ppt "INTRO TO MAKING A WEBSITE Mark Zhang.  HTML  CSS  Javascript  PHP  MySQL  …That’s a lot of stuff!"

Similar presentations


Ads by Google