1 of 40

Unit 1:Introduction to Internet Programming

2 of 40

Introduction to Internet

A global computer network providing a variety of information and

communication facilities, consisting of interconnected networks using standardized communication protocols.

The Internet is the global system of interconnected computer networks that use the Internet protocol suite (TCP/IP) to link devices worldwide. It is a network of networks that consists of private, public, academic, business, and government networks of local to global scope. The Internet carries a vast range of information resources and services.

3 of 40

4 of 40

5 of 40

6 of 40

7 of 40

8 of 40

9 of 40

10 of 40

11 of 40

12 of 40

History of Internet

This marvelous tool has quite a history that holds its roots in the cold war scenario. A need was realized to connect the top universities of the United States so that they can share all the research data without having too much of a time lag. This attempt was a result of Advanced Research Projects Agency (ARPA) which was formed at the end of 1950s just after the Russians had climbed the space era with the launch of Sputnik. After the ARPA got success in 1969, it

didn‘t take the experts long to understand that how much potential can this interconnection tool have. In 1971 Ray Tomlinson made a system to send electronic mail. This was a big step in the making as this opened gateways for remote computer accessing i.e.telnet.

13 of 40

World Wide Web

The World Wide Web (abbreviated WWW or the Web) is an information space where documents and other web resources are identified by Uniform Resource Locators (URLs), interlinked by hypertext links, and can be accessed via the Internet. English scientist TimBerners-Lee invented the World Wide Web in 1989. He wrote the first web browser computerprogram in 1990 while employed at CERN in Switzerland. The Web browser was released outside CERN in 1991, first to other research institutions starting in January 1991 and to the general public on the Internet in August 1991.

 

14 of 40

World Wide Web conti…

The World Wide Web has been central to the development of the Information Age and is the primary tool billions of people use to interact on the Internet. Web pages are primarily text documents formatted and annotated with Hypertext Markup Language (HTML).

Embedded hyperlinks permit users to navigate between web pages. Multiple web pages with a common theme, a common domain name, or both, make up a website. Website content can largely be provided by the publisher, or interactively where users contribute content depends upon the users or their actions. Websites may be mostly informative, primarily for entertainment, or largely for commercial, governmental, or non-governmental organizational purposes WWW

15 of 40

Protocol

The elements in a URL: Protocol://server's address/filename

Hypertext protocol: http://www.aucegypt.edu

File Transfer Protocol: ftp://ftp.dartmouth.edu

Telnet Protocol: telnet://pac.carl.org

News Protocol: news:alt.rock-n-roll.stones

16 of 40

Domains

What are Domains? Domains divide World Wide Web sites into categories based on the nature of their owner, and they form part of a site's address, or uniform resource locator (URL).

Common top-level domains are:

.com—commercial enterprises

.mil—military site

.org—organization site (non-profits, etc.) int—organizations established by

international treaty

.net—network

.biz—commercial and personal

.edu—educational site (universities, schools, etc.)

.info—commercial and personal

.gov—government organizations

.name—personal sites

17 of 40

The Birth of the Web (Late 1980s)

The story begins with Tim Berners-Lee, a British computer scientist working at CERN. In the late 1980s, he conceived the idea of the World Wide Web as a way to share information among researchers. In 1990, he proposed the concept of the web and created the first web browser and web server software.

HTML: The Foundation (1991)

In 1991, Berners-Lee introduced HTML (Hypertext Markup Language), the fundamental language of the web. HTML allowed the structuring of documents with hyperlinks, forming the basis of web pages. The first-ever website, which explained the World Wide Web, went live in 1993.

18 of 40

The Browser Wars and Dynamic Content (Mid-1990s)

The mid-1990s witnessed the rise of web browsers. Netscape Navigator, released in 1994, played a significant role in popularizing the web. Microsoft's Internet Explorer joined the competition, leading to the "Browser Wars." Developers began experimenting with JavaScript in 1995, bringing dynamic content and interactivity to web pages.

CSS: Separating Style from Content (Late 1990s)

As the web grew, maintaining consistent design became challenging. In 1996, the World Wide Web Consortium (W3C) introduced CSS (Cascading Style Sheets). CSS allowed developers to separate content from presentation, making web design more flexible and standardized.

19 of 40

Dot-com Bubble and the Emergence of Web 2.0

(Late 1990s - Early 2000s)

The late 1990s saw the dot-com bubble, marked by speculative investments in internet-related companies. While many startups failed, the web continued to evolve. The early 2000s ushered in Web 2.0, emphasizing user-generated content, social media, and technologies like AJAX (Asynchronous JavaScript and XML) that enabled dynamic web applications.

The Mobile Revolution (Mid-2000s)

With the introduction of the iPhone in 2007, mobile devices became a significant challenge for web development. Responsive web design emerged as a solution, ensuring websites adapted to various screen sizes and orientations.

20 of 40

Frameworks and Libraries (2000s - Present)

As web development became more complex, frameworks and libraries like jQuery, Angular, React, and Vue.js gained popularity. These tools streamlined development, promoted best practices, and facilitated the creation of interactive web applications.

Full-Stack Development (2010s - Present)

The concept of full-stack development emerged, with developers skilled in both front-end (client-side) and back-end (server-side) technologies. DevOps practices bridged the gap between development and IT operations, fostering a holistic approach to web development.

21 of 40

Web Accessibility and Progressive Web Apps

(2010s - Present)

In recent years, web accessibility has gained prominence, emphasizing the importance of creating inclusive web experiences for all users. Progressive Web Apps (PWAs) also became popular, offering offline capabilities and a more app-like experience on the web.

Modern Web Development

Web development is embracing AI and machine learning for personalized user experiences. Virtual Reality (VR) and Augmented Reality (AR) were starting to influence web development, offering new possibilities for immersive experiences. The field continued to evolve rapidly, with developers exploring the latest technologies and standards.

22 of 40

Client-Server Architecture - System Design

Client-server architecture is a fundamental concept in system design where a network involves multiple clients and a server. Clients are devices or programs that request services or resources, while the server is a powerful machine providing these resources or services. This architecture allows efficient data management and resource sharing, making it popular in web applications, databases, and other network-based systems. By separating roles and distributing tasks, client-server architecture enhances performance, scalability, and security.

23 of 40

What is Client-Server Architecture?

Client-server architecture is a cornerstone of modern system design, where the network infrastructure is structured to include multiple clients and a central server. In this model, clients are devices or programs that make requests for services or resources, while the server is a powerful machine or software that fulfills these requests. Communication between clients and the server follows a request-response protocol, such as HTTP/HTTPS for web services or SQL for database queries.

24 of 40

Overview “History of Internet”

Advanced Research Projects Agency (ARPA) which was formed at the end of 1950s.

In 1971 Ray Tomlinson made a system to send electronic mail. This was a big step in the making as this opened gateways for remote computer accessing i.e.telnet.

English scientist TimBerners-Lee invented the World Wide Web in 1989. He wrote the first web browser computerprogram in 1990 while employed at CERN in Switzerland.

In 1991, Berners-Lee introduced HTML (Hypertext Markup Language)

25 of 40

Netscape Navigator, released in 1994

Developers began experimenting with JavaScript in 1995, bringing dynamic content and interactivity to web pages.

In 1996, the World Wide Web Consortium (W3C) introduced CSS (Cascading Style Sheets).

In 2000 frameworks and libraries like jQuery, Angular, React, and Vue.js gained popularity.

Overview “History of Internet”

26 of 40

27 of 40

28 of 40

29 of 40

Client-Server Architecture

  • This architecture allows for efficient data management and resource allocation by centralizing critical functions on the server, which can handle complex processing and large-scale data storage.
  • Clients manage user interactions and send specific requests to the server, which processes these requests and sends back appropriate responses.
  • The client-server architecture is highly scalable, as it can accommodate more clients by scaling the server's capabilities or adding additional servers.
  • This design is prevalent in various applications, including web services, database management, and email systems, providing a robust framework for developing and managing complex, distributed systems efficiently.

30 of 40

Importance in System Design

  • Centralized Management: By centralizing resources and services on a server, this architecture simplifies maintenance, updates, and security management. Administrators can efficiently monitor and manage data, apply updates, and enforce security policies from a single location.
  • Scalability: Client-server architecture supports scalability. As the number of clients grows, additional servers can be added, or existing server capacities can be expanded to handle increased demand without significantly altering the overall system architecture.
  • Resource Optimization: This model allows for optimized resource allocation. Servers are designed to handle intensive processing and large data storage, while clients are optimized for user interactions and requests. This separation ensures efficient use of system resources.
  • Reliability and Availability:  Client-server systems can ensure high reliability and availability. Redundancies, backups, and load balancing techniques can be implemented on the server side to minimize downtime and ensure continuous service availability.
  • Enhanced Security: Centralized servers enable better security controls and data protection measures. Sensitive data can be securely stored on servers, and access can be tightly controlled and monitored. Encryption and authentication mechanisms can be more effectively implemented.

31 of 40

Key Components of Client Server Architecture

  • Client: The client is a device or application that requests services or resources from the server. It initiates communication with the server and processes the results returned by the server.
  • Server: The server is a powerful machine or application that provides services or resources to clients. It processes client requests, performs the necessary computations or data retrieval, and sends back the appropriate responses.
  • Network: The network facilitates communication between clients and servers. It enables data exchange using various protocols and ensures reliable connectivity.
  • Protocols: Protocols are standardized rules that govern data transmission and communication between clients and servers. They ensure that data is transmitted in a secure, reliable, and understood manner.
  • Middleware: Middleware is software that acts as an intermediary between clients and servers. It provides additional functionalities like authentication, logging, message queuing, and transaction management.
  • Database: A database is a structured collection of data stored on the server. It stores and manages data that clients request, ensuring data consistency, integrity, and security.
  • User Interface (UI): The UI is the part of the client application that interacts with the user. It provides a means for users to input data and view results returned by the server.
  • Application Logic: Application logic refers to the code and algorithms that define the application's functionality. It processes user inputs, interacts with the server, and manages the flow of data between the client and the server.

32 of 40

Frameworks and Tools for Client-Server Development

Developing client-server applications involves various frameworks and tools that cater to both the client and server sides. Here are some commonly used frameworks and tools for client-server development:

33 of 40

1. Server-Side Frameworks

  • Node.js: A JavaScript runtime built on Chrome's V8 engine, ideal for building scalable network applications.
  • Express.js: A minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications.
  • Django: A high-level Python web framework that encourages rapid development and clean, pragmatic design. Comes with a built-in ORM, admin interface, and authentication mechanisms.
  • Spring Boot: A Java-based framework that simplifies the development of new Spring applications. Provides embedded servers and simplifies dependency management.
  • Ruby on Rails: A server-side web application framework written in Ruby. Emphasizes convention over configuration and the use of the MVC(Model-View-Controller) pattern.

34 of 40

2. Client-Side Frameworks�

  • React: A JavaScript library for building user interfaces, maintained by Facebook. Allows for the creation of reusable UI components and provides a virtual DOM for efficient rendering.
  • Angular: A platform and framework for building single-page client applications using HTML and TypeScript. Developed and maintained by Google.
  • Vue.js: A progressive JavaScript framework for building user interfaces. Designed to be incrementally adoptable, with a core library focused on the view layer.
  • Svelte: A radical new approach to building user interfaces, shifting much of the work to compile time. Produces highly optimized vanilla JavaScript at build time.
  • Bootstrap: A popular front-end framework for developing responsive and mobile-first websites. Provides pre-designed components and utilities.

35 of 40

3. Database Management Systems

  • MySQL: An open-source relational database management system. Widely used for web applications and known for its reliability and ease of use.
  • PostgreSQL: An advanced open-source relational database system. Known for its robustness, extensibility, and standards compliance.
  • MongoDB: A NoSQL database that uses a flexible, JSON-like document model. Ideal for applications requiring high performance, scalability, and flexibility in data structure.
  • SQLite: A self-contained, serverless, and zero-configuration SQL database engine. Suitable for embedded systems and small applications.

36 of 40

4. Communication Protocols and APIs

  • REST: Representational State Transfer, an architectural style for designing networked applications. Uses standard HTTP methods and is stateless.
  • GraphQL: A query language for APIs and a runtime for executing those queries. Allows clients to request exactly the data they need, reducing over-fetching.
  • WebSocket: A protocol providing full-duplex communication channels over a single TCP connection. Ideal for real-time applications like chat and gaming.

37 of 40

5. Development Tools

  • Postman: A collaboration platform for API development. Allows users to create, test, and document APIs.
  • Swagger: A suite of tools for API design and documentation. Provides an interface for developing and interacting with APIs.
  • Docker: A platform for developing, shipping, and running applications in containers. Ensures consistency across multiple development and production environments.
  • Kubernetes: An open-source system for automating deployment, scaling, and management of containerized applications. Provides powerful orchestration capabilities.
  • Git: A distributed version control system for tracking changes in source code during software development. Essential for collaborative development and maintaining code history.

38 of 40

Communications Protocol 

39 of 40

OSI (Open System Interconnection) model:

  1. Physical Link: Transportation medium (RS-232, USB, Firewire, Ethernet, optical fiber, radio link)
  2. Data Link: Functional and procedural means of data transfer. Physical addressing and arrangement of bits. (LLC, token bus, x-25, CAN-bus)
  3. Network: Transfer of data sequences and managing routes. (NBF, CNLS)
  4. Transport: Providing reliable data transfer to the upper levels. End-to-end data transfer. Success of data transmission, error check. (TP0,TP1,TP2,TP3,TP4)
  5. Session: Controlling the dialog between terminals. Synchronization of exchanges, session opening and closing. (Half duplex, full duplex, etc.)
  6. Presentation: Formatting and encrypting/decrypting data to be sent on the network. (ASCII)
  7. Application: End user access point, interact with software application. (Modbus)

40 of 40

TCP/IP, a more pragmatic approach from the internet:

  1. Link Layer: The lowest layer (closest to the machine), the physical and logical connection between host and nodes. (Ethernet, IEEE 802)
  2. Internet Layer: Regrouping the methods, protocols, and specification of data packets transportation. (IP for Internet Protocol, using IPv4 or IPv6)
  3. Transportation Layer: Providing end-to-end communication; ensuring reliability, flow control, and multiplexing. (TCP or UDP)
  4. Application Layer: The highest layer (closest to the user) protocols, it uses the transportation and internet layer to establish host-to-host connection. (FTP, HTTP, FMTP, etc.).