Join our channel if you haven't joined yet https://t.me/fresco_milestone ( @fresco_milestone ) Wings1 T1 Mini-project - ReactlS Application Open Project folder (you can find in desktop) in VS Code application "pe below code */Desktop/Projectswings..Resesst/App "te: import React, { Component } from "react"; class App extends Component { state = { newTitle: "", newDescription newTopic: "", addedagenda: [ i title: "Angular", description: "Sone description about the angular”, topics: ["Introduction", "typescript", "Why Angular?", “Understanding Versions", "Fundamentals" } b t title: "vue" description: "Sone description about the vue", topics: ["Introduction", "Javascript", "Why Vue2", "Vue Bindings", "Conponent Interaction" ] y L topicsarr: (1, showAgendaBlock: false 3 changeFun = e => { const value = e.target.values const name = e.target.name; this.setstate({ [name]: value }) } topicFun = () => { ‘this. state. topicsArr.push(this.state.newTopic) this.setState({ newTopic: "" }); 3 agendaFun = () => { var agenda = {Join our channel if you haven't joined yet https://t.me/fresco_milestone ( @fresco_milestone ) title: this.state.newTitle, description: this.state.newDescription, topics: this.state.topicsarr t this.setState({ newTitle: "" }) this.setState({ newDescription: this.setState({ newTopics: ‘this.setState({ topicsarr: ‘this. state. AddedAgenda. push(agenda) 3 formchec = (e) => { e.preventdefault() + checkAgendaFun = () => { ‘this. state.showAgendaBlock === false ? this.setState({ showAgendaBlock: true }) : this.setState({ showAgendaBlock: false }) 3 render() { return (

Agenda Manager {Ithis.state. showAgendaBlock &&

Click To View Agenda

ext" nami

Join our channel if you haven't joined yet https://t.me/fresco_milestone ( @fresco_milestone } {this.state.new0escription.trim(). length © ? “Description is required” : “"}

ext" nam {this state.newTopic.trim() length ‘this.state.topicsArr. length === 0 ? "Topic is required” : ""}

+ Add Topic btn btn-success submitALign" {this.state.topicsArr.length === 0 8&

No Topics Added

} (this. state.topicsarr.length |

Added Topics

Join our channel if you haven't joined yet https://t.me/fresco_milestone ( @fresco_milestone }

{this. state. topicsarr.map(topic return (
• {topic}
) ty

Refer the topics you added

+

+ (this. state. showAgendaBlock &&

{agenda. title}

{agenda.topics.map(topic => { return (
• {topic}
) yt
Join our channel if you haven't joined yet https://t.me/fresco_milestone ( @fresco_milestone ) {agenda.description}

»?}