MEAN & MERN Stack Assignments

 Create " Adduser " component and add User registration form to it with username , date of birth and city fields.  Validation rules:         All fields are mandatory         Username should have min length of 4 characters and max of 8 characters. Note: After a new user, the table should render the latest data

    Take a counter in Parent component and increment & decrement its value from Child component.

 Make API call to  "  https://jsonplaceholder.typicode.com/users " , get data into "Users" component and display it as 4 cards in a row (Bootstrap grid of cards). Add " Add User " button to each card. When we click on "Add user" button, the user count need to be incremented by one in "Usercount" component.

 1.Design the following UI 2.Create the following Layout 

 1. Consider the following component hierarchy . Root component have 6 Products components as children. Create one Product component and reuse it for 6 times , each time passing different data as props( product image, name, brand, price) The final UI should have 3 products in each row. Use CSS flex. Use the following products array for sample data set [   {     id: 1,     title: "Fjallraven - Foldsack No. 1 Backpack, Fits 15 Laptops",     price: 109.95,     description: "Your perfect pack for everyday use and walks in the forest. Stash your laptop (up to 15 inches) in the padded sleeve, your everyday",     category: "men's clothing",     image: "https://fakestoreapi.com/img/81fPKd-2AYL._AC_SL1500_.jpg",     rating: {       rate: 3.9,       count: 120     }   },   {     id: 2,     title: "Mens Casual Premium Slim Fit T-Shirts ",     price: 22.3,     description: "Slim-fitting style, contrast raglan long sleeve, three-button henl

 1.Get data from  the API "  https://jsonplaceholder.typicode.com/todos " and   display the data in both table and grid of cards format 2. Read a number as input from user and print the factors of it on web page. 3. Read two numbers as input from user and create a simple calculator to perform arithmetic operations and the result can be printed on webpage.

 1. Create a promise which can be either fulfilled or rejected after 5 secs   2. Revise HTML elements like table, div,  span,  img etc...and design the following layout using HTML and CSS

 1. Define the following array of object in a module and export it.      employees= [    {       name:"raju",       age:34,       skills:["reactjs","angular","nodejs"],       address:{          street:"kphb",          city:"hyderabad"       }    },    {       name:"bhanu",       age:36,       skills:["reactjs","angular","nodejs"],       address:{          street:"miyapur",          city:"hyderabad"       }    },    {       name:"vikas",       age:40,       skills:["java","angular","python"],       address:{          street:"koyambed",          city:"chennai"       }    },    {       name:"varun",       age:58,       skills:["reactjs","python","nodejs"],       address:{          street:"time square",          city:"warangal"       }    },    {      

 1. Consider the following string                 aaaabbababababbbbabababaaaa          Find frequency of "a" and "b".   Note- Frequency means, the no of times that specific character has                   appeared. 2. Write a function to receive a string of multiple words as argument          and then print the no of words in that string.          Example:               Input : how are you all               Output: 4

1. Find sum of elements of an array  2. Consider the following array       [ 1 ,2 , 3, 4 ]       Create new array by adding 10 to first element, 20 to second element , 30 to third element and so on using map() method.          [1,2,3,4 ]======>[ 11,22,33,44] 3. Consider the following array of students marks          [               { name:"ravi", marks :{ maths: 89, physics : 70 , chemistry :88}},             { name:"bhanu", marks :{ maths: 98, physics : 50 , chemistry :68}},             { name:"kiran", marks :{ maths: 50, physics : 82 , chemistry :94}},         ]     Find the names of students who got highest marks in maths , physics and chemistry. 

 1. Create Employee class and add properties name, age, basic and add getSalary method to its prototype. Create 5 Employee objects and print their salaries.  2. Create Product class and add properties brand, price, model and add getDiscountPrice method to its prototype. Create 5 Products objects and print their discount price. Note: For each object of these 5 , send different discount percentages as argument Read the following articles: https://www.w3schools.com/js/js_object_constructors.asp https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes

1. Create student, bus , employee and mobile objects with all possible properties  2. Create Student object with properties roll number, name, marks(array),address and method to compute aggregate of marks 3. Create product object with properties product number, product name, model, price and a method to return discount price by receiving the discount percentage as argument.