A Full Semester Internship report on

FULL STACK WEB DEVELOPMENT

Submitted in a partial fulfilment for the award of the degree of
BACHELOR OF TECHNOLOGY
IN
ELECTRONICS AND COMMUNICATION ENGINEERING
Submitted by
SURAM MADHAVA REDDY
(202H1A04C6)
Under the Esteemed Guidance of
Mrs. M Kezia Aruna Jyothi, M.Tech.
Associate Professor, Dept. of ECE

DEPARTMENT OF
ELECTRONICS AND COMMUNICATION ENGINEERING

AUDISANKARA INSTITUTE OF TECHNOLOGY

(AUTONOMOUS)

Accredited by NAAC with ‘A+’ Grade | Approved by AICTE | Affiliated to JNTUA

NH5 Bypass Road, Gudur – 524101, Tirupati (DT.)
Andhra Pradesh
www.audisankara.ac.in
2023-2024

1
 AUDISANKARA INSTITUTE OF TECHNOLOGY
(AUTONOMOUS)
NH5 Bypass Road, Gudur – 524101, Tirupati (DT.) Department of
Electronics and Communication Engineering

This is Industry/Research Internship report on entitled “FULL STACK

WEB DEVELOPMENT” is the bonafide work done by the student
SURAM MADHAVA REDDY, REGD NO : 202H1A04C6, in partial
fulfilment of the requirements for the award of degree of Bachelor of
Technology in Electronics and Communication Engineering, from
Jawaharlal Nehru Technological University Anantapur, Anantapuram
during the year 2023- 2024.

Internship Guide Head of the Department

Mrs. Kezia Aruna Jyothi M.Tech Prof. J. AMARENDRA M.Tech., (Ph.D.)
Associate Professor, Associate Professor & HoD
Department of ECE, Department of ECE,
ASIT, GUDUR – TIRUPATI (DT). ASCET, GUDUR – TIRUPATI (DT).

Internal Guide Signature:

2
 INDEX
S.No Contents Page No.
1. Abstract 4
2. Company Profile 5-6
3. Domain name & 7-8
Explanation
4. Software & Hardware 9 - 10
Tools
5. Internship Diary 11-14
6. References 15

3
 Title of Full Semester Internship
Full Stack Web Development
Abstract
Slash Mark is pleased to announce its Full Stack Web Development Internship program,
designed to provide aspiring developers with hands-on experience and mentorship in the
dynamic field of web development. This internship offers a comprehensive learning
experience, covering both frontend and backend technologies essential for building robust
web applications. Web development is the art and science of building interactive and
responsive digital interfaces accessible through web browsers. It involves front-end
development, focusing on the user interface and user experience, and back-end
development, which deals with server-side logic, databases, and application functionality.
Key components of web development include HTML (Hypertext Markup Language), CSS
(Cascading Style Sheets), and JavaScript, which collectively form the foundation of the
client-side development responsible for rendering content in browsers. Additionally,
various front-end frameworks and libraries, such as React, Angular, and Vue.js, aid
developers in creating dynamic and engaging user interfaces. On the back-end, web
development utilizes server-side technologies such as Node.js, Python, Ruby on Rails, or
PHP. These technologies handle data processing, server management, and database
interactions. Databases, such as MySQL, PostgreSQL, and MongoDB, store and retrieve
data essential for web applications. Responsive web design is a crucial aspect of modern
web development, ensuring that websites adapt seamlessly to various screen sizes and
devices. This responsiveness is achieved through media queries and flexible layouts,
enhancing the user experience across desktops, tablets, and mobile devices. Security is a
paramount consideration in web development, encompassing measures such as encryption
(HTTPS), secure coding practices, and user authentication mechanisms to protect against
cyber threats. Continuous integration and continuous deployment (CI/CD) pipelines are
employed to automate testing, integration, and deployment processes, streamlining
development workflows and ensuring code quality. In conclusion, web development is a
dynamic and evolving field that combines creativity and technology to deliver engaging,
secure, and user-friendly digital experiences on the World Wide Web
Web development is the art and science of building interactive and responsive digital
interfaces accessible through web browsers. It involves front-end development, focusing
on the user interface and user experience, and back-end development, which deals with
server-side logic, databases, and application functionality.

4
 Company Profile

Slash Mark is an innovative IT startup company dedicated to revolutionizing the digital

landscape through cutting-edge technologies and a customer-centric approach. Founded with a
vision to redefine user experiences and address evolving needs, Slash Mark focuses on product
expansion, global growth, tech advancements, strategic partnerships, talent development,
customer-centricity, and sustainability.

1. Product Expansion: At Slash Mark, we believe in continuously enhancing our

products to meet the ever-changing demands of our users. Our relentless pursuit of innovation
drives us to introduce new features and products, ensuring that we stay ahead of the curve in a
rapidly evolving digital environment.

2. Global Growth: With a strategic approach to market expansion, Slash Mark is

committed to reaching users globally. By entering new markets strategically and expanding our
user base, we aim to establish a strong presence in key regions worldwide, catering to diverse
audiences with tailored solutions.

3. Tech Advancements: Staying at the forefront of technology is ingrained in our

DNA. Slash Mark leverages the power of artificial intelligence and continually integrates the
latest technological advancements to enhance user experiences across all our platforms. Our
focus on tech innovation ensures that our products remain at the cutting edge of the industry.

4. Strategic Partnerships: Collaboration is key to our growth strategy at Slash Mark.

Through strategic partnerships with industry leaders and innovative startups, we enrich our
product offerings and extend our market reach. By leveraging collective expertise and
resources, we drive mutual success and deliver greater value to our customers.

5. Talent and Development: At Slash Mark, we recognize that our greatest asset is our
people. We are committed to attracting top talent and fostering a culture of continuous learning
and innovation. By investing in employee development, we empower our team to drive
forward- thinking solutions and fuel our growth trajectory.

6. Customer-Centric Focus: Our customers are at the heart of everything we do.

Slash Mark prioritizes customer support and actively solicits feedback to refine our products
and services. By listening to our users and adapting to their needs, we ensure that every
interaction with Slash Mark is positive and enriching.

5
7. Sustainability and Privacy: As stewards of the digital landscape, Slash Mark is
committed to sustainability and data privacy. We embrace sustainable practices in our
operations and reinforce stringent data security measures to safeguard user privacy. By
upholding the highest ethical standards, we build trust and credibility with our customers.

Internship Opportunities: Slash Mark offers internship opportunities across various

domains to nurture young talent and foster innovation. Through the AICTE portal, aspiring
interns can apply to join our dynamic team in the following domains:
 Artificial Intelligence
 Machine Learning
 Data Science
 React Internship
 Full Stack Web Development Internship
 Java Development
 Python Development
 Business Analyst Internship
 Internet Of Things Internship
 Cyber Security Internship
Our internship programs provide hands-on experience and mentorship from industry experts,
empowering interns to contribute meaningfully to the future of technology while honing their
skills and expertise.

6
 Domain Name &Explanation
Web Development

What is Web Development?

• At its core, web development is the process of building and maintaining websites and
web applications. It's what makes the internet such a dynamic and interactive place.
• Web developers use a variety of programming languages, tools, and frameworks
to bring websites to life.

Key Areas of Web Development

• Frontend Development (Client-Side): This focuses on what users see
and interact with. Frontend developers use:
o HTML: The basic structure and content of a web page.
o CSS: Controls styling like colors, fonts, and layouts.
o JavaScript: Makes pages interactive with animations, user input handling,
and dynamic content updates.
• Backend Development (Server-Side): Handles the logic, data storage, and
the "behind-the-scenes" work that powers a website's functionality. Backend
developers use:
o Programming Languages: Python, Java, Ruby, PHP, Node.js, and more.
o Databases: Stores website data (e.g., user profiles, product information).
Popular choices include MySQL, PostgreSQL, MongoDB.
o Servers: Software like Apache or Nginx that actually deliver the website
to users browsers.
Web Development Process (Simplified)
1. Planning: Defining the website's purpose, goals, and target audience.
2. Design: Creating the visual look and user experience (UX/UI).
3. Frontend Development: Building the structure, style, and interactiveness of
the website's interface using HTML, CSS, and JavaScript.

7
 4. Backend Development: Creating the server-side logic, databases,
and functionality.
5. Testing: Thorough testing for bugs, compatibility, and performance.
6. Deployment: Publishing the website live on the internet.
7. Maintenance: Regular updates, security patches, and new features.
Types of Websites Web Developers Create
• Static Websites: Simpler websites with fixed content.
• Dynamic Websites: Sites that change based on user interaction or have
frequently updated content (e.g., news sites).

• Web Applications: Complex web systems performing specific functions (e.g.,

online stores, social networks, project management tools).
• E-commerce Websites: Designed for selling products or services online.
• Content Management Systems (CMS): Platforms like WordPress, Drupal,
or Joomla that simplify the website creation and management process.

Learning Web Development

There are fantastic resources to learn web development! Here are a few approaches:

• Online Courses: Platforms like Codeacademy, Udemy, Coursera offer

structured courses.
• Free Tutorials: W3Schools, FreeCodeCamp, and countless others
provide excellent tutorials and references.
• Build Projects: Create your own websites to practice and build a portfolio.

As per my Internship, I have assigned certain Tasks/Projects which I need to be complete

for getting the Internship Certificate. The Projects are:

 Basic Projects
 Product Landing Page
 Basic Portfolio
 Weather Forecast Website
 Intermediate Projects
 URL Shorner
 Online Code Editor

8
Software and Hardware tools:

Web development requires a specific combination of software and hardware tools, although
the specific needs can vary depending on project complexity and individual preferences.
Here's a breakdown of the essentials:

Hardware:
Laptop:
A laptop is the essential tool required for completing a web development internship
effectively. Ensure your laptop meets the necessary specifications and features to
support coding, testing, and deploying web applications efficiently.
Software:
Text Editor or Code Editor:
These are specialized programs designed for writing and editing code
efficiently. Popular options include Visual Studio Code, Sublime Text, Atom,
and Brackets.Currently Iam using Visual Studio Code for writing code.
Web Browsers:
Testing your website across different browsers like Chrome, Firefox, Safari,
Edge, and Opera ensures compatibility across various platforms and devices.
FTP Client:
This software helps transfer files between your computer and the web server
where your website is hosted. Common options include FileZilla.

Until Basic Level Projects I used Visual Studio Code , Chrome as Software Tools,but The
Following are the Software which I used to complete Intermediate level Projects and
reason for using those tools is those projects demands that type of software tools.

JavaScript:
JavaScript is a high-level, interpreted programming language primarily used for
client-side web development. It enables interactive and dynamic website
creation by allowing developers to manipulate webpage content, control browser
behavior, and respond to user actions.

Node.js:
Node.js is an open-source, server-side JavaScript runtime environment built on
Chrome's V8 JavaScript engine. It allows developers to execute JavaScript code
outside of a web browser, enabling server-side scripting for building scalable
and efficient web applications.

ReactJS:
ReactJS, commonly referred to as React, is an open-source JavaScript library
developed by Facebook for building user interfaces (UIs) and single-page
applications (SPAs). React allows developers to create reusable UI components
that efficiently manage and update the application's state.

9
MongoDB:
MongoDB is a popular open-source NoSQL database management system that
stores data in flexible, JSON-like documents. It diverges from traditional
relational databases by offering a more flexible data model, allowing for greater
scalability and agility in handling unstructured or semi-structured data. In
MongoDB, data is stored in documents, which are JSON-like structures
consisting of key-value pairs. These documents are organized into collections,
similar to tables in relational databases. MongoDB is designed to scale
horizontally across multiple servers, making it well-suited for handling large
volumes of data and high-throughput applications.

Postman:
Postman is a popular collaboration platform for API development that simplifies
the process of designing, testing, and documenting APIs. It provides a user-
friendly interface for creating and sending HTTP requests, allowing developers
to interact with APIs easily. Postman enables users to organize and group related
API requests into collections for better management and collaboration.

10
 Internship Diary
Name of Student: Suram Madhava reddy
Mode of Internship: Online
Domain of Internship: Full Stack Web Development
Company Name: SlashMark

Week 1:

S.No Day Date Name of the Day Topics/Work Completed

Day 1 22-01-2024 Monday Introduction to Company and
1
Project Overview
Day2 23-01-2024 Tuesday Familarization With
2
Version Control
System(Git)
3 Day3 24-01-2024 Wednesday Introduction HTML Basics

4 Day4 25-01-2024 Thursday Introduction CSS Basics

5 Day5 26-01-2024 Friday Holiday [Republic Day]

6 Day6 27-01-2024 Saturday Practice

7 Day7 28-01-2024 Sunday Practice

11
Week 2:
S.No Day Date Name of the Day Topics/Work Completed
1 Day 1 29-01-2024 Monday Deep Dive into HTML
Tags, Semantics.
2 Day2 30-01-2024 Tuesday Advanced CSS concepts
(Flexbox).
3 Day3 31-01-2024 Wednesday Advanced CSS concepts (Grid,
Media Queries).
4 Day4 01-02-2024 Thursday Hands-on exercises on creating
responsive layouts.
5 Day5 02-02-2024 Friday Practice

6 Day6 03-02-2024 Saturday Practice

7 Day7 04-02-2024 Sunday Practice

Week 3:
S.No Day Date Name of the Day Topics/Work Completed
1 Day 1 05-02-2024 Monday Introduction to JavaScript
2 Day2 06-02-2024 Tuesday Introduction to JavaScript
fundamentals (variables, data
types, operators)
3 Day3 07-02-2024 Wednesday Understanding functions

4 Day4 08-02-2024 Thursday scope, and closures.

5 Day5 09-02-2024 Friday DOM manipulation and event

handling.
6 Day6 10-02-2024 Saturday Practice

7 Day7 11-02-2024 Sunday Practice

12
Week 4:
S.No Day Date Name of the Day Topics/Work Completed
1 Day 1 12-02-2024 Monday Introduction to Product Landing
Page Project
2 Day2 13-02-2024 Tuesday Understanding The Given Project
3 Day3 14-02-2024 Wednesday Gathering the Resources

4 Day4 15-02-2024 Thursday Creating/Writing HTML Code for

Product Landing Page Project
5 Day5 16-02-2024 Friday Creating/Writing CSS Code for
Product Landing Page Project
6 Day6 17-02-2024 Saturday Bugs Fixing

7 Day7 18-02-2024 Sunday Uploaded Web Page in

my GitHub account

Week 5:
S.No Day Date Name of the Day Topics/Work Completed
1 Day 1 19-02-2024 Monday Introduction to Portfolio Project
2 Day2 20-02-2024 Tuesday Understanding The Given Project
3 Day3 21-02-2024 Wednesday Gathering the Resources

4 Day4 22-02-2024 Thursday Creating/Writing HTML Code for

Product Landing Page Project
5 Day5 23-02-2024 Friday Creating/Writing CSS Code for
Product Landing Page Project
6 Day6 24-02-2024 Saturday Styling the Portfolio Website

7 Day7 25-02-2024 Sunday Uploaded Web Page in

my GitHub account

13
Week 6:
S.No Day Date Name of the Day Topics/Work Completed
1 Day 1 26-02-2024 Monday Introduction to Weather
Forecast Project
2 Day2 27-02-2024 Tuesday Installation of Node.js
3 Day3 28-02-2024 Wednesday Creating an API Key
from weather API
website
4 Day4 29-02-2024 Thursday Creating/Writing HTML Code for
Product Landing Page Project
5 Day5 01-03-2024 Friday Creating/Writing CSS Code for
Product Landing Page Project
6 Day6 02-03-2024 Saturday Bugs Issues

7 Day7 03-03-2024 Sunday Uploaded Web Page in

my GitHub account

14
REFERENCES:
 For successful completion of projects these are referred
during the analysis and execution phase of the projects

 YOUTUBE
 GEEKSFORGEEKS
 CHATGPT
 GITHUB

WEBSITE LINKS:

WEBSITE: https://www.geeksforgeeks.org/what-is-full-stack-development/

YOUTUBE: www.youtube.com/@simplilearnOfficial

15