FDEN
FDEN
Semantic HTML :
Semantic HTML uses HTML tags that clearly describe their purpose and meaning.
These tags make it easier for browsers, search engines, and developers to understand
1.Easy to Understand: The code becomes clearer and more organized for developers.
2.Better for Search Engines (SEO):Search engines understand the content better, improving the
website's ranking.
3.Accessible for Everyone:Screen readers for visually impaired users can interpret the
content accurately.
---------------------------------------------------------------------------
1.Box Model:Explains how elements are structured using margins, borders, padding, and content.
2.Flexbox:A layout method for arranging items in rows or columns with flexible spacing.
3.CSS Grid:A powerful two - dimensional system for creating complex layouts.
4.Positioning:Methods like static, relative, absolute, fixed, and sticky for placing elements.
5.Float and Clear:Older method for layout, using float to position elements and clear to avoid
overlaps.
------------------------------------------------------------------------------
What is Git ?
1.Git is a version control system(VCS) that tracks changes made to files over time.It allows multiple
developers to collaborate on a project, keeping track of every modification, so you can always revert
to an earlier version if needed.
2.Local Version Control : Git works on your local computer and allows you to create a full version
history of your project.It helps in managing versions and handling conflicts when collaborating with
others.
What is GitHub ?
GitHub is a cloud - based platform for hosting Git repositories and collaborating on projects.It allows
developers to store their Git repositories online, share code, and work together on projects.
GitHub features :
1.Repository Hosting : Hosts Git repositories in the cloud for easy access and collaboration.
2.Collaboration Tools : Provides features like pull requests, issues, and projects to help teams
collaborate.
What is Branching ?
1.Branching is a core feature of Git that allows you to create a separate line of development within
the same project.
2.Each branch represents an independent work stream.It’s like a parallel universe for your project
where you can make changes without affecting the main(usually called main or master) branch.
What is Merging ?
1.Merging is the process of integrating changes from one branch into another.Usually, you'll merge a
feature branch into the main branch once the feature or bug fix is complete.
2.Merge Conflicts : If two branches have made changes to the same part of a file, Git will flag this as
a merge conflict.You’ll need to resolve these conflicts manually before completing the merge.
1.A pull request(PR) is a request to merge your branch into another branch(typically the main
branch) on GitHub.It allows other team members to review your code before it is merged into the
main project.
2.Pull requests are an essential part of collaborative workflows and ensure that the code is reviewed,
tested, and approved by other developers before it becomes part of the main project.
--------------------------------------------------------------------------------------------------------------------------------------
# Unit 2: Backend
What is Node.js ?
Node.js is an open - source, cross - platform runtime environment that allows JavaScript to
be executed on the server.It is built on Google Chrome's V8 JavaScript engine and is used to create
fast, scalable, and lightweight server-side applications.
1.Single - Threaded Architecture :Node.js uses a single thread to handle all requests.
2.Non - blocking I / O : It processes multiple requests without waiting for one to finish.
3.Event - Driven Architecture :The system relies on events and callbacks to manage tasks efficiently.
3.Event Loop : The event loop continuously checks for new events and assigns them to the
appropriate handlers.
4.Callbacks : Once a task is complete, a callback function is triggered to process the result.This design
ensures that the server doesn’t block operations while waiting for tasks like database queries or
file reads to complete.
1.High Scalability : Node.js can handle thousands of concurrent connections without creating
multiple threads.
2.Efficient Resource Usage : It uses fewer system resources because a single thread manages multiple
tasks.
3.Fast Response Time : Non - blocking operations ensure requests are processed quickly.
4.Real - Time Applications : Ideal for chat apps, live notifications, and gaming, where quick updates
are crucial.
5.Simpler Code : Callbacks and event listeners simplify the handling of asynchronous operations.
------------------------------------------------------------------------------ -
SQL(Structured Query Language) databases store data in tables with rows and columns.They
are structured and use a fixed schema for defining how the data is organized.
1.Structured Schema : The database schema is predefined and rigid(tables, columns, relationships).
2.ACID Properties : Ensures reliable transactions with Atomicity, Consistency, Isolation, and
Durability.
3.Table - based Storage : Data is stored in tables that consist of rows and columns.
4.Relational Data : SQL databases can manage relationships between tables(e.g., using
foreign keys).
------------------------------------------------------------------------------ -
NoSQL databases are designed for unstructured data and provide more flexibility in storing
and managing data.They are ideal for handling large amounts of unstructured, distributed data.
Key Features of NoSQL :
1.Schema - less Data Models : No fixed schema, allowing easy storage of different types of data.
2.Scalability : NoSQL databases are designed for horizontal scaling, making them suitable for large -
scale applications.
3.Variety of Data Models : Includes document - based, key - value pairs, graph - based, and column -
family stores.
2.Key - Value Stores : Simple key - value pairs. Example : Redis, DynamoDB
3.Column - Family Stores : Stores data in columns rather than rows.Example : Cassandra, HBase
4.Graph Databases : Used for managing and analyzing data in the form of graphs.Example : Neo4j
------------------------------------------------------------------------------ -
ORM is a technique that allows developers to interact with databases using objects instead
of writing raw SQL queries.It provides a way to map an object - oriented domain model to a
relational database.
1.Object Mapping : It converts data between objects in the programming language(like JavaScript or
Python) and relational data structures.
2.Query Generation : Developers use object - oriented methods to interact with the database.The
ORM automatically generates SQL queries in the background.
Benefits of ORM :
3.Data Integrity : Helps maintain the consistency and structure of the data.
-------------------------------------------------------------------------------
API :
An API is a set of rules and protocols that allows one software application to communicate with
another.APIs define the methods and data formats that applications can use to request and
exchange information.
REST is an architectural style for building web services that can be easily scaled and
maintained.It is based on using standard HTTP methods like GET, POST, PUT, and DELETE, along with
a stateless communication model.
RESTful Services :
RESTful API is an API that adheres to the principles and constraints of REST.
-------------------------------------------------------------------------------
When designing and building an API, it's important to follow best practices to make the API easy to
use and maintain:
RESTful endpoints should clearly reflect the resource being accessed and the operation being
performed.
Example of endpoints :
-------------------------------------------------------------------------------
REST principles :
1.Statelessness: Each API request is independent, meaning that the server does not store any
information about the client between requests.Every request must contain all the information the
server needs to fulfill it(e.g., authentication details).
2.Client - Server Architecture : The client and server operate independently.The client is responsible
for the user interface, while the server manages data and business logic. This separation allows for
better scalability and easier updates.
3.Uniform Interface : A consistent, well - defined set of methods(such as GET, POST, PUT, DELETE)
is used to interact with resources. Resources are typically represented as URLs and can be
manipulated via HTTP requests.
4.Resource - Based : Resources are the main objects of interest in REST APIs.They could be users,
products, or any other entity in the system.Each resource is identified by a unique URL(Uniform
Resource Locator).
5.Example : GET / users / 123 could represent a request to retrieve the data for a user with ID 123.
-------------------------------------------------------------------------------
Authentication : Authentication is the process of verifying the identity of the user or client making
the request.
1.Basic Authentication : Sending username and password with each request(not recommended for
production due to security risks).
2.Token - based Authentication(e.g., JWT) : The client sends a token(such as a JSON Web Token) with
each request, which is validated by the server.A token is typically issued after the user logs in and
then used to authenticate subsequent requests.
3.Server Response : If the credentials are correct, the server responds with a JWT token.
-------------------------------------------------------------------------------
Express.js(for Node.js):
-Key Features :
4.Integration : Works seamlessly with databases like MongoDB or SQL and templating
engines like EJS or Handlebars.
Flask(for Python):
Designed to be simple, flexible, and easy to use for small or medium - sized applications.
-Key Features :
1.Minimalistic: Provides only essential tools, allowing developers to customize their setup.
-------------------------------------------------------------------------------
# Unit 3- Fullstack
-------------------------------------------------------------------------------
Web Security :
Web security refers to the measures and practices that ensure websites, web applications, and their
data are protected from unauthorized access, attacks, and data breaches.It focuses on safeguarding
sensitive information and ensuring reliable operation.
Key Aspects of Web Security:
2.Integrity : Ensure that data is accurate and has not been tampered with.
3.Availability :Ensure that services remain accessible to authorized users at all times.
-------------------------------------------------------------------------------
SSL(Secure Sockets Layer) and its successor TLS(Transport Layer Security) are cryptographic
protocols designed to provide secure communication over the internet.
SSL : The older version of the protocol; now largely replaced by TLS.
TLS: An updated and more secure version of SSL.Despite this, people often still refer
to TLS as "SSL."
1.Handshake Process :
The server responds with its SSL certificate containing its public key and other details.
The client verifies the server’s certificate to ensure it is trusted and issued by a Certificate
Authority(CA).
The session key is then used for symmetric encryption of the actual data.
3.Encrypted Communication :
All data transferred between the client and the server is encrypted using the session
key.
This ensures that even if the data is intercepted, it cannot be read without
the session key.
--------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------ -
- Continuous Integration(CI)
CI is a practice where developers integrate(add) their code into a shared repository frequently, often
multiple times a day.
Each integration triggers an automated build and testing process to ensure the code works correctly.
Key Features of CI
1.Frequent Code Integration: Developers merge their code changes regularly with the main
codebase.This reduces conflicts when multiple developers are working on the same project.
2.Automated Builds: Every time code is integrated, the system automatically compiles the
code and checks for errors.
3.Automated Tests: The new code is automatically tested to ensure it doesn’t break
existing functionality.
4.Early Problem Detection: Errors are identified and fixed early in the development process,
saving time and effort.
---------------------------------------
- Continuous Deployment(CD)
2.It ensures that changes to the code, once tested, are automatically deployed to
production(live environment).
1.Automated Deployment : Code that passes all tests is automatically released to users.
2.Incremental Updates: Small and frequent updates make it easier to identify issues.
3.Rollback Options :If a problem occurs, the system can quickly revert to the previous
version.
------------------------------------------------------------------------------ -
Jenkins :
1.Jenkins is an open - source automation server used to automate various tasks in the
software development lifecycle, such as building, testing, and deploying applications.
2.It is most commonly used for Continuous Integration(CI) and Continuous Deployment(CD).
3.Jenkins helps automate repetitive tasks, saving time and effort for developers and making
software development more efficient.
1.Automation : Jenkins automates the process of building, testing, and deploying code, which means
developers don’t have to manually perform these tasks.
2.Extensibility:Jenkins has a rich ecosystem of plugins that extend its functionality.You can integrate
Jenkins with many tools, including version control systems(like Git), build tools(like Maven or Gradle),
testing frameworks, and deployment platforms.
3.Pipeline Support :Jenkins supports pipelines, which define the entire workflow of building, testing,
and deploying code.A pipeline can be defined through code(in a file called Jenkinsfile), making the
process versioned and easy to maintain.
4.Distributed Builds:Jenkins can distribute the work of building and testing across multiple machines,
speeding up the process when there is a large codebase or many tests.
------------------------------------------------------------------------------ -
GitLab CI:
1.GitLab CI(Continuous Integration) is a built - in feature of GitLab, a popular web - based platform
for version control using Git.
2.It helps automate the process of integrating and deploying code by running continuous integration
and continuous deployment pipelines directly within GitLab repositories.
3.GitLab CI automates tasks such as building, testing, and deploying your code so that developers can
focus on writing features rather than worrying about manual processes.
1.Built - in with GitLab: Unlike other CI / CD tools that require third - party integrations, GitLab CI is
natively built into GitLab, making it easier to set up and use with GitLab repositories.
2.Automation with Pipelines : Pipelines are a collection of jobs that define the workflow for CI / CD
processes, like build, test, and deploy. These pipelines run automatically whenever there’s a
change in the repository.
3.Configurable with.gitlab - ci.yml : GitLab CI uses a configuration file called.gitlab - ci.yml to define
the steps of the CI / CD pipeline. In this file, you describe the different jobs(e.g., build, test, deploy)
and their order.
4.Parallel Execution : Jobs within a pipeline can be run in parallel, which speeds up the process.For
example, tests can run at the same time as the build proces
------------------------------------------------------------------------------ -
Travis CI :
1.Travis CI is a cloud - based Continuous Integration(CI) service that automatically builds and tests
code every time a developer makes changes(commits) to their project.
2.It integrates directly with GitHub, making it a popular choice for open - source and private projects
hosted there.
3.Travis CI automates the process of building, testing, and deploying applications, helping developers
to catch errors early, improve code quality, and speed up the deployment process.
1.Integration with GitHub: Travis CI is tightly integrated with GitHub, and any changes made to a
GitHub repository can trigger automatic builds and tests in Travis CI.
2.Automated Builds and Tests : Travis CI automatically builds and tests your project whenever code is
pushed to GitHub.This ensures that errors are detected early in the development process.
3.Configurable with.travis.yml : Travis CI uses a configuration file called.travis.yml to define the build
process, including what software to install, what commands to run, and the test scripts to execute.
4.Support for Multiple Languages : Travis CI supports a wide range of programming languages,
including JavaScript, Python, Ruby, Java, PHP, Go, and many more.
-------------------------------------------------------------------------------
Package Manager :
A Package Manager is a tool that automates the process of installing, upgrading, configuring,
and removing software packages.These packages often include libraries or tools that help you
develop your projects, and package managers simplify dependency management and installation.
------------
npm :
1.npm stands for Node Package Manager.It is the default package manager for Node.js, which is a
runtime environment for JavaScript.
2.npm helps you install and manage libraries or packages(collections of reusable code) that you use
in your JavaScript or Node.js applications.
1.Package Management : npm allows you to easily install, update, and uninstall packages.
2.Version Control : npm ensures that the correct version of a package is installed, helping to avoid
conflicts between different versions of the same package.
3.Dependency Management : When you install a package, npm also installs any dependencies that
package needs.
4.Global and Local Packages : npm can install packages both globally(for use in any project) and
locally(specific to a project).
------------
pip:
1.pip is the Package Installer for Python.It is the most widely used package manager for Python and
allows you to install and manage Python libraries and tools.
2.pip helps developers to easily install external Python packages or libraries that can be reused in
projects, saving time and effort.
1.Install Packages : pip downloads and installs packages from the Python Package Index(PyPI), which
contains thousands of open - source Python libraries.
2.Dependency Resolution : pip ensures that all the dependencies required by a package are installed
automatically.
------------
gem :
1.gem is the package manager for the Ruby programming language.It allows developers to easily
install, manage, and distribute Ruby libraries or gems(collections of Ruby code).
2.Ruby gems are used to extend Ruby applications with external functionality, like web
frameworks(e.g., Rails) or database libraries.
1.Install Gems : gem installs packages(gems) from the RubyGems repository, which is the official
platform for distributing Ruby libraries.
2.Version Management : gem manages versions of installed gems and makes sure they are
compatible with your Ruby version.
3.Dependency Handling : gem automatically installs dependencies required by the gems you install.
-------------------------------------------------------------------------------
Webpack :
1.Webpack is a module bundler for JavaScript applications.It is a powerful tool that bundles
JavaScript files(and other assets like CSS, images, HTML) into a single or multiple output files to
optimize loading performance on the web.
1.Bundling: Webpack bundles all your JavaScript, CSS, HTML, images, and other assets into one or
more optimized files for the web.
2.Loaders : Webpack uses loaders to process files and convert them into valid modules(e.g.,
converting TypeScript to JavaScript or SCSS to CSS).
-------------------------------------------------------------------------------
Babel :
1.Babel is a JavaScript compiler that allows you to write modern JavaScript(ES6 and beyond) and
then transpile it to backward - compatible JavaScript that can run in older browsers.
2.Babel helps developers use new JavaScript features(like arrow functions, async / await, and
modules) without worrying about browser support.
1.Transpilation: Babel converts modern JavaScript(like ES6 + ) into a version of JavaScript that works
in older browsers.For example, it converts ES6 classes and arrow functions into ES5 code.
2.Plugins& Presets : Babel uses presets(collections of plugins) to define which features you want to
transpile.You can configure it to use different presets depending on your needs(li
-------------------------------------------------------------------------------
Developer Tools :
1.Browser Developer Tools(DevTools) are a set of built - in tools in web browsers(like Google Chrome,
Firefox, or Microsoft Edge) that help developers inspect, debug, and optimize their web applications.
2.These tools allow developers to view and modify the page’s structure, style, console messages,
and network activity directly in the browser.
1.Elements Panel : This shows the HTML structure of the page.Developers can inspect and modify
HTML elements, attributes, and styles on the fly.
2.Console Panel : The console displays JavaScript errors, warnings, and console.log() outputs.It helps
developers debug their JavaScript code by showing real - time logs.
3.Network Panel : This allows developers to monitor all network requests, such as API calls, images,
and CSS files, to see their load times and status codes(e.g., 404, 200).
--------------------------------------------------------------------------------------------------------------------------------------
# Unit 5 : SoftSkills
-------------------------------------------------------------------------------
Agile development is a way of creating software by breaking down the work into small parts and
delivering it in steps.This allows for quick changes based on feedback, ensuring the product meets
user needs.
-------------------------------------------- -
There are regular meetings like daily check - ins and reviews of work at the end of each
sprint.
Kanban :Kanban is a visual method to manage work using a board with columns like "To Do," "In
Progress," and "Done."There are no set time periods like in Scrum, and tasks move through the
board as they're worked on.
--------------------------------------------------------
3.Extreme Programming(XP) : Focuses on improving the quality of the software through frequent
releases and testing.
------------------------------------------------------------
User Stories :A simple description of a feature from the user's point of view, like: "As a user, I want to
log in so I can access my account."
Sprints : A short period(usually 1 - 4 weeks) during which a team completes certain tasks.
Retrospectives : A meeting held at the end of a sprint where the team discusses what went well,
what didn’t, and how to improve for the next sprint.
------------------------------------------------------
Collaboration tools help teams work together more effectively by allowing them to communicate,
track tasks, and share files.Examples include Slack, Jira, and Trello.
------------------------------------------------------
6) What is Jira ?
Jira is a tool that helps teams track their tasks and progress, especially in agile projects like Scrum or
Kanban.It helps organize the work, manage sprints, and track issues or bugs.
------------------------------------------------------ -
7) What is Trello ?
Trello is a visual task management tool where you organize work on a board with cards.Each card
represents a task, and you move them from "To Do" to "In Progress" to "Done."
8) What is Slack ?
Slack is a messaging platform for teams.It lets you send messages, share files, and create
channels to keep conversations organized by topic or project.
----------------------------------------------------------
Communication : Tools like Slack allow teams to chat, share files, and hold video calls, making it
easier to work together.
Teamwork : Tools like Jira and Trello help teams stay organized and track who is doing what, ensuring
everyone works together efficiently.
-------------------------------------------------------------------------------