Ii Year Aiml Full Stack-1 & Design Thinking

Download as pdf or txt
Download as pdf or txt
You are on page 1of 5

B.Tech.

Artificial Intelligence and Machine Learning JNTUA R23 Regulations

II Year B.Tech. AI & ML – II Semester


L T P C
0 1 2 2
(23A52401) FULL STACK DEVELOPMENT – 1
(Skill Enhancement Course)

Course Objectives: The main objectives of the course are to


• Make use of HTML elements and their attributes for designing static web pages
• Build a web page by applying appropriate CSS styles to HTML elements
• Experiment with JavaScript to develop dynamic web pages and validate forms

Course Outcomes:
 CO1: Design Websites. (L6)
 CO2: Apply Styling to web pages. (L4)
 CO3: Make Web pages interactive. (L6)
 CO4: Design Forms for applications. (L6)
 CO5: Choose Control Structure based on the logic to be implemented. (L3)
 CO6: Understand HTML tags, Attributes and CSS properties (L2)

Experiments covering the Topics:


● Lists, Links and Images
● HTML Tables, Forms and Frames
● HTML 5 and Cascading Style Sheets, Types of CSS
● Selector forms
● CSS with Color, Background, Font, Text and CSS Box Model
● Applying JavaScript - internal and external, I/O, Type Conversion
● JavaScript Conditional Statements and Loops, Pre-defined and User-defined Objects
● JavaScript Functions and Events
● Node.js

Sample Experiments:

1. Lists, Links and Images


a. Write a HTML program, to explain the working of lists.
Note: It should have an ordered list, unordered list, nested lists and ordered list in an
unordered list and definition lists.
b. Write a HTML program, to explain the working of hyperlinks using <a> tag and href,
target Attributes.
c. Create a HTML document that has your image and your friend’s image with a specific
height and width. Also when clicked on the images it should navigate to their respective
profiles.
d. Write a HTML program, in such a way that, rather than placing large images on a page,
the preferred technique is to use thumbnails by setting the height and width parameters to
something like to 100*100 pixels. Each thumbnail image is also a link to a full sized
version of the image. Create an image gallery using this technique

2. HTML Tables, Forms and Frames


● Write a HTML program, to explain the working of tables. (use tags: <table>, <tr>, <th>,
<td> and attributes: border, rowspan, colspan)
● Write a HTML program, to explain the working of tables by preparing a timetable. (Note:
Use <caption> tag to set the caption to the table & also use cell spacing, cell padding,
border, rowspan, colspan etc.).
B.Tech. Artificial Intelligence and Machine Learning JNTUA R23 Regulations

● Write a HTML program, to explain the working of forms by designing Registration form.
(Note: Include text field, password field, number field, date of birth field, checkboxes,
radio buttons, list boxes using <select>&<option> tags, <text area> and two buttons ie:
submit and reset. Use tables to provide a better view).
● Write a HTML program, to explain the working of frames, such that page is to be divided
into 3 parts on either direction. (Note: first frame image, second frame paragraph, third
frame 🡪 hyperlink. And also make sure of using “no frame” attribute such that frames to
be fixed).

3. HTML 5 and Cascading Style Sheets, Types of CSS


a. Write a HTML program, that makes use of <article>, <aside>, <figure>, <figcaption>,
<footer>, <header>, <main>, <nav>, <section>, <div>, <span> tags.
b. Write a HTML program, to embed audio and video into HTML web page.
c. Write a program to apply different types (or levels of styles or style specification formats)
- inline, internal, external styles to HTML elements. (identify selector, property and
value).

4. Selector forms
a. Write a program to apply different types of selector forms
● Simple selector (element, id, class, group, universal)
● Combinator selector (descendant, child, adjacent sibling, general sibling)
● Pseudo-class selector
● Pseudo-element selector
● Attribute selector

5. CSS with Color, Background, Font, Text and CSS Box Model
a. Write a program to demonstrate the various ways you can reference a color in CSS.
b. Write a CSS rule that places a background image halfway down the page, tilting it
horizontally. The image should remain in place when the user scrolls up or down.
c. Write a program using the following terms related to CSS font and text:
i. font-size ii. font-weight iii. font-style
iv. text-decoration v. text-transformation vi. text-alignment
d. Write a program, to explain the importance of CSS Box model using
i. Content ii. Border iii. Margin iv. padding

6. Applying JavaScript - internal and external, I/O, Type Conversion


a. Write a program to embed internal and external JavaScript in a web page.
b. Write a program to explain the different ways for displaying output.
c. Write a program to explain the different ways for taking input.
d. Create a webpage which uses prompt dialogue box to ask a voter for his name and age.
Display the information in table format along with either the voter can vote or not

7. JavaScript Pre-defined and User-defined Objects


a. Write a program using document object properties and methods.
b. Write a program using window object properties and methods.
c. Write a program using array object properties and methods.
d. Write a program using math object properties and methods.
e. Write a program using string object properties and methods.
f. Write a program using regex object properties and methods.
g. Write a program using date object properties and methods.
h. Write a program to explain user-defined object by using properties, methods, accessors,
constructors and display.
B.Tech. Artificial Intelligence and Machine Learning JNTUA R23 Regulations

8. JavaScript Conditional Statements and Loops


a. Write a program which asks the user to enter three integers, obtains the numbers from the
user and outputs HTML text that displays the larger number followed by the words
“LARGER NUMBER” in an information message dialog. If the numbers are equal, output
HTML text as “EQUAL NUMBERS”.
b. Write a program to display week days using switch case.
c. Write a program to print 1 to 10 numbers using for, while and do-while loops.
d. Write aprogram to print data in object using for-in, for-each and for-of loops
e. Develop a program to determine whether a given number is an ‘ARMSTRONG
NUMBER’ or not. [Eg: 153 is an Armstrong number, since sum of the cube of the digits is
equal to the number i.e.,13 + 53+ 33 = 153]
f. Write a program to display the denomination of the amount deposited in the bank in terms
of 100’s, 50’s, 20’s, 10’s, 5’s, 2’s & 1’s. (Eg: If deposited amount is Rs.163, the output
should be 1-100’s, 1-50’s, 1- 10’s, 1-2’s & 1-1’s)

9. Java script Functions and Events


a. Design a appropriate function should be called to display
● Factorial of that number
● Fibonacci series up to that number
● Prime numbers up to that number
● Is it palindrome or not
b. Design a HTML having a text box and four buttons named Factorial, Fibonacci, Prime,
and Palindrome. When a button is pressed an appropriate function should be called to
display
11. Factorial of that number
12. Fibonacci series up to that number
13. Prime numbers up to that number
14. Is it palindrome or not
c. Write a program to validate the following fields in a registration page
i. Name (start with alphabet and followed by alphanumeric and the length should not
be less than 6 characters)
ii. Mobile (only numbers and length 10 digits)
iii. E-mail (should contain format like [email protected])

Text Books:
1. Programming the World Wide Web, 7th Edition, Robet W Sebesta, Pearson, 2013.
2. Web Programming with HTML5, CSS and JavaScript, John Dean, Jones & Bartlett
Learning, 2019 (Chapters 1-11).
3. Pro MERN Stack: Full Stack Web App Development with Mongo, Express, React, and
Node, Vasan Subramanian, 2nd edition, APress, O’Reilly.
Web Links:

1. https://www.w3schools.com/html
2. https://www.w3schools.com/css
3. https://www.w3schools.com/js/
4. https://www.w3schools.com/nodejs
5. https://www.w3schools.com/typescript
B.Tech. Artificial Intelligence and Machine Learning JNTUA R23 Regulations

II Year B.Tech. AI & ML – II Semester


L T P C
1 0 2 2
(23A99401) DESIGN THINKING FOR INNOVATION

Course Objectives:

The objective of this course is to familiarize students with design thinking process as a tool
for breakthrough innovation. It aims to equip students with design thinking skills and ignite
the minds to create innovative ideas, develop solutions for real-time problems.

Course Outcomes:

 Define the concepts related to design thinking. (L1, L2)


 Explain the fundamentals of Design Thinking and innovation (L1, L2)
 Apply the design thinking techniques for solving problems in various sectors. (L3)
 Analyse to work in a multidisciplinary environment (L4)
 Evaluate the value of creativity (L5)
 Formulate specific problem statements of real time issues (L3, L6)

UNIT I Introduction to Design Thinking

Introduction to elements and principles of Design, basics of design-dot, line, shape, form as
fundamental design components. Principles of design. Introduction to design thinking, history
of Design Thinking, New materials in Industry.

UNIT II Design Thinking Process

Design thinking process (empathize, analyze, idea & prototype), implementing the process in
driving inventions, design thinking in social innovations. Tools of design thinking - person,
costumer, journey map, brainstorming, product development
Activity: Every student presents their idea in three minutes, Every student can present design
process in the form of flow diagram or flow chart etc. Every student should explain about
product development.

UNIT III Innovation

Art of innovation, Difference between innovation and creativity, role of creativity and
innovation in organizations- Creativity to Innovation- Teams for innovation- Measuring the
impact and value of creativity.
Activity: Debate on innovation and creativity, Flow and planning from idea to innovation,
Debate on value-based innovation.

UNIT IV Product Design


Problem formation, introduction to product design, Product strategies, Product value, Product
planning, product specifications- Innovation towards product design- Case studies
Activity: Importance of modelling, how to set specifications, Explaining their own product
design.
B.Tech. Artificial Intelligence and Machine Learning JNTUA R23 Regulations

UNIT V Design Thinking in Business Processes


Design Thinking applied in Business & Strategic Innovation, Design Thinking principles that
redefine business – Business challenges: Growth, Predictability, Change, Maintaining
Relevance, Extreme competition, Standardization. Design thinking to meet corporate needs-
Design thinking for Startups- Defining and testing Business Models and Business Cases-
Developing & testing prototypes.

Activity: How to market our own product, About maintenance, Reliability and plan for
startup.

Textbooks:
1. Tim Brown,Change by design, Harper Bollins (2009)
2. Idris Mootee, Design Thinking for Strategic Innovation, 2013, John Wiley & Sons.

Reference Books:
1. David Lee, Design Thinking in the Classroom, Ulysses press
2. Shrutin N Shetty, Design the Future, Norton Press
3. William Lidwell,Universal Principles of Design- Kritinaholden, Jill Butter.
4. Chesbrough.H, The Era of Open Innovation – 2013

Online Learning Resources:


https://nptel.ac.in/courses/110/106/110106124/
https://nptel.ac.in/courses/109/104/109104109/
https://swayam.gov.in/nd1_noc19_mg60/preview

You might also like