0% found this document useful (0 votes)
10 views18 pages

Tools and Technologies

The document outlines various tools and technologies for web development, focusing on backend frameworks like Laravel and Node.js, as well as frontend technologies such as HTML, CSS, and JavaScript. It highlights the benefits of using these frameworks, including scalability, community support, and ease of integration for real-time communication and media streaming. Additionally, it mentions development tools like Visual Studio Code and GitHub for coding and version control, along with testing tools like Postman and Browser DevTools.

Uploaded by

tayyab arshad
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
10 views18 pages

Tools and Technologies

The document outlines various tools and technologies for web development, focusing on backend frameworks like Laravel and Node.js, as well as frontend technologies such as HTML, CSS, and JavaScript. It highlights the benefits of using these frameworks, including scalability, community support, and ease of integration for real-time communication and media streaming. Additionally, it mentions development tools like Visual Studio Code and GitHub for coding and version control, along with testing tools like Postman and Browser DevTools.

Uploaded by

tayyab arshad
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 18

Tools/Technology

 Backend:

Laravel: Laravel is a web application framework


with expressive, elegant syntax. A web framework
provides a structure and starting point for creating your
application, allowing you to focus on creating something
amazing while we sweat the details.
Laravel strives to provide an amazing developer
experience while providing powerful features such as
thorough dependency injection, an expressive database
abstraction layer, queues and scheduled jobs, unit and
integration testing, and more.
Whether you are new to PHP web frameworks or have
years of experience, Laravel is a framework that can grow
with you. We'll help you take your first steps as a web
developer or give you a boost as you take your expertise
to the next level. We can't wait to see what you build.
Why is Laravel?
There are a variety of tools and frameworks available to
you when building a web application. However, we
believe Laravel is the best choice for building modern,
full-stack web applications.
A Progressive Framework
We like to call Laravel a "progressive" framework. By
that, we mean that Laravel grows with you. If you're just
taking your first steps into web development, Laravel's
vast library of documentation, guides, and video tutorials
will help you learn the ropes without becoming
overwhelmed.
If you're a senior developer, Laravel gives you robust
tools for dependency injection, unit testing, quees, real-
time events, and more. Laravel is fine-tuned for building
professional web applications and ready to handle
enterprise work loads.
A Scalable Framework
Laravel is incredibly scalable. Thanks to the scaling-
friendly nature of PHP and Laravel's built-in support for
fast, distributed cache systems like Redis, horizontal
scaling with Laravel is a breeze. In fact, Laravel
applications have been easily scaled to handle hundreds of
millions of requests per month.
Need extreme scaling? Platforms like Laravel cloud allow
you to run your Laravel application at nearly limitless
scale.
A Community Framework
Laravel combines the best packages in the PHP ecosystem
to offer the most robust and developer friendly framework
available. In addition, thousands of talented developers
from around the world have contributed to the framework.
Who knows, maybe you'll even become a Laravel
contributor.
Node.js: Node.js is an open-source and cross-platform
JavaScript runtime environment. It is a popular tool for
almost any kind of project!
Node.js runs the V8 JavaScript engine, the core of Google
Chrome, outside of the browser. This allows Node.js to be
very performant.
A Node.js app runs in a single process, without creating a
new thread for every request. Node.js provides a set of
asynchronous I/O primitives in its standard library that
prevent JavaScript code from blocking and generally,
libraries in Node.js are written using non-blocking
paradigms, making blocking behavior the exception rather
than the norm.
When Node.js performs an I/O operation, like reading
from the network, accessing a database or the filesystem,
instead of blocking the thread and wasting CPU cycles
waiting, Node.js will resume the operations when the
response comes back.
This allows Node.js to handle thousands of concurrent
connections with a single server without introducing the
burden of managing thread concurrency, which could be a
significant source of bugs.
Node.js has a unique advantage because millions of
frontend developers that write JavaScript for the browser
are now able to write the server-side code in addition to
the client-side code without the need to learn a completely
different language.
In Node.js the new ECMAScript standards can be used
without problems, as you don't have to wait for all your
users to update their browsers - you are in charge of
deciding which ECMAScript version to use by changing
the Node.js version, and you can also enable specific
experimental features by running Node.js with flags.
 Frontend:

HTML, CSS: The HyperText Markup Language


(HTML) and Cascading Style Sheets (CSS) languages are
the primary tools for developing the interesting and
interactive websites we expect while browsing. They each
play a role in delivering web pages. HTML structures and
provides content, while CSS handles most of the
formatting for the pages.
Knowing HTML and CSS enables you to enter the job
market with the skills to create engaging websites that
present a professional public face for your business.

Key HTML and CSS Features


Today's web page designers use both HTML and CSS.
They are two separate components integral to creating
engaging and useful websites. HTML defines the content
and CSS manages the presentation. One important way
CSS accomplishes this is by formatting many pages at
once.
Accessing a web page requires three components (well,
four if you count the network infrastructure), including:
 Files containing the site content and formatting
instruction (HTML, CSS and JavaScript files)
 A web server hosting these files and making them
available to web clients
 Web browsers installed on

HyperText Markup Language (HTML)


The HTML language delivers page content, such as titles,
headers, paragraphs, tables, etc. Content writers generate
information, tutorial steps, news or other information,
which is then marked up or structured using HTML.
HTML offers some control of page layout, but that's not
its strength (especially when CSS is available). One issue
with HTML presentation management is its static content
(hence the use of CSS and JavaScript for animations and
other engaging visuals on the page).
HTML uses a system of tags to manage content structure.
An essential authoring and troubleshooting tip is to verify
content has both an opening and closing tag. Information
between two tags takes on the structure the tags define.

Cascading Style Sheets (CSS)


Cascading Style Sheets are concerned with content
presentation, not delivery. They define settings such as
background, colors, font types, font sizes, etc. CSS
specifies a look and feel for the website and enforces that
on the content delivered by HTML.
It's vital to note CSS's efficiency in managing page
formatting for many pages or an entire site. It's easier to
define a blue background color for all site pages in one
file rather than for each page. That's especially true if you
change the background color to green in the future.
Another CSS advantage is its ability to adapt to various
screen sizes, screen orientations and devices. This is
critical today, where web users access sites from
computers, tablets, phones, TVs and other devices.
CSS formatting is called from inside the HTML code.
Consider HTML as the primary document, with
references to CSS to understand how the content should
look. CSS pages don't call HTML.
You can integrate CSS into your web design in three
ways:
 Inline: Use the style attribute inside a tag
 Internal: Use the <style> tag to bracket text
 External: Use the <link> tag to reference an external
CSS document with format instructions
External CSS pages use the .css file extension.

HTML vs. CSS


In summary, HTML defines page content, such as text
and images. It offers basic formatting tags, but it's really
CSS that allows site designers to create flexible, engaging
and easily maintained sites.
 HTML: Responsible for the content and basic
structure
 CSS: Responsible for the style, layout and
presentation

JavaScript: Web pages consist of three basic


components: HTML, CSS and JavaScript.
JavaScript provides dynamic and interactive functionality
to web pages. Features like buttons, information
conversion, math functions and more enhance the user
experience.
Developers may write very simple JavaScript instructions
directly into the HTML page, but it's more likely that
JavaScript will be saved in its own file and called via
the <script> tag by the HTML page.
The example below shows some basic HTML code.
Notice the <script> tags that call a JavaScript function.
Figure 1: HTML code with <script> tags

Livewire: Live wire is the wire that is active for


carrying current in the circuit. This live wire is also
known as the hot wire. To indicate the live wire the
colors that are to be used is Red and Brown. This live
wire is the wire that conducts current through the
devices.A live wire is the wire which carries current to
the device. When there is something wrong inside the
device or circuit and the live wire occurs to get
connected to some metal part, the circuit breaker will
blow to protect the user from irrelevant sensation or
electrocution.

When a live wire comes into contact with a neutral wire


the resistance of the circuit falls with drastic change and
there will be a large amount of current flow in the
circuit.A short circuit can happen due to the disruption
of insulation of the wires or water forming the contact
between the live wire and neutral wire. The large
current generation causes fire in the circuit.

Real-Time Communication
WebRTC: WebRTC uses JavaScript, APIs
and Hypertext Markup Language to embed
communications technologies within web browsers. It is
designed to make audio, video and data communication
between browsers user-friendly and easy to implement.
WebRTC works with most major web browsers.
WebRTC APIs perform several key functions, including
accessing and recording video-, audio- and text-based
data from devices to initiating, monitoring and ending
P2P connections between devices via browsers and
facilitating bidirectional data transfer over multiple data
channels.

In most cases, WebRTC connects users by transferring


real-time audio, video and data from device to device
using P2P communications. In situations where users are
on different Internet Protocol (IP) networks that have
Network Address Translation (NAT) firewalls that
prevent RTC, WebRTC can be used in conjunction with
Session Traversal Utilities for NAT (STUN) servers. This
enables a given IP address to be translated into a public
internet address so peer connections can be established.

But there are also networks that are so restrictive that


even a STUN server cannot be used to translate IP
addresses. In these cases, WebRTC is used with a
Traversal Using Relays around NAT (TURN) server,
which relays traffic between users, enabling them to
connect. The Interactive Connectivity Establishment
protocol is used to find the best connection.
Before audio and video files are sent, they must be
compressed due to their large size. Also, media that is
received over a peer connection must be decompressed.
WebRTC uses a codec process to do this.

Media Server
Ant Media Server: Ant Media Server is a ready-
to-use, highly scalable, real-time video streaming
solution. It supports Ultra-Low Latency (WebRTC), Low
Latency (LL-DASH/CMAF and LL-HLS) and standard
latency (HLS) for live streaming.
Ant Media Server (AMS) can be easily and quickly
deployed on-premises or on public cloud networks like
AWS, Azure, Google Cloud, Digital Ocean, Oracle, and
Linode/Akamai.
Ant Media Server is available in two
versions: Community Edition and Enterprise Edition.
A table of comparisons is provided below.
There are two installation options for Ant Media Server:
standalone (a single server) and cluster (many connected
servers). When set up in cluster mode, Ant Media Server
can dynamically scale both horizontally and vertically to
support thousands of viewers and broadcasters at once in
an automated and controlled manner.
In addition to supporting live stream playback in any web
browser, the SDKs for iOS, Android, Flutter, React
Native, Unity, and JavaScript are also freely available for
users to increase their audience reach.

Usage scenarios

👨🏽‍💻 Education
Ant Media can provide virtual classrooms to teachers
using ultra-low latency technology, enabling teachers to
connect with the audience using 1-1 or 1-many
connection types.

🤖 IP camera streaming
Watch and Monitor IP cameras with ultra-low latency on
a web browser with Ant Media Server. You can embed
ONVIF IP camera streams into your websites and mobile
applications.

🙇 Webinars
Ant Media Server supports N-N live video/audio
conferencing by using WebRTC, allowing you to achieve
ultra-low latency (~ 0.5 sec). Ant Media Server also
provides scalability, which can help you scale up your
solution dynamically.

👾 Mobile streaming application


Using our SDKs, you can integrate your mobile
application solutions with Ant Media Server and build a
fast, reliable, and stable streaming platform with AMS
APIs and SDKs.

📺 Live game shows


Live video experience has a significant role in live game
show success, with the strong requirement of being
scalable and having low latency.

🎯 E-sports & betting streaming


Due to the ever-growing e-sports domain, there is a
tremendous demand for video streaming with ultra-low
latency.

🎭 Auctions and bidding


Live auctions should be streamed with ultra-sub-second
latency in order to get bids on time

✨ Video game streaming


Ant Media Server resolves interactivity and scalability
issues by providing ultra-low-latency streaming via
WebRTC.

🎭 Telehealth
Build your own telehealth application with Ant Media
Server to create a seamless interaction between doctors
and patients.
Development Tools
Visual Studio Code, GitHub: Visual Studio
Code features a lightning fast source code editor, perfect
for day-to-day use. With support for hundreds of
languages, VS Code helps you be instantly productive
with syntax highlighting, bracket-matching, auto-
indentation, box-selection, snippets, and more. Intuitive
keyboard shortcuts, easy customization and community-
contributed keyboard shortcut mappings let you navigate
your code with ease.
For serious coding, you'll often benefit from tools with
more code understanding than just blocks of text. Visual
Studio Code includes built-in support for IntelliSense
code completion, rich semantic code understanding and
navigation, and code refactoring.
And when the coding gets tough, the tough get
debugging. Debugging is often the one feature that
developers miss most in a leaner coding experience, so we
made it happen. Visual Studio Code includes an
interactive debugger, so you can step through source
code, inspect variables, view call stacks, and execute
commands in the console.
VS Code also integrates with build and scripting tools to
perform common tasks making everyday workflows
faster. VS Code has support for Git so you can work with
source control without leaving the editor including
viewing pending changes diffs.
GitHub is primarily used for managing code and working
with teams through a system called version control.
Version control lets developers keep a history of every
change made to a project. This means you can easily go
back to previous versions, see who changed what, and
work on new features without overwriting each other’s
work.
Testing: Postman (for API testing), Browser
DevTools (for front-end debugging)

You might also like