So the entire project is to build a planner app but we JUST HAVE TO DO TASK #9 (Screenshot attached), the ideal look should be that of slide 30 (also attached).You can use RedwoodJS, react, google...

1 answer below »
So the entire project is to build a planner app but we JUST HAVE TO DO TASK #9 (Screenshot attached), the ideal look should be that of slide 30 (also attached).
You can use RedwoodJS, react, google calender (must be implemented). This project is a multi-group collaboration and we only have to do 9.



We want to have a built in intergrated calender code that we can use for this project. Please explain in steps as well on how you did the project.



You can refer to this github for ideas:https://github.com/ericz1803/react-google-calendar
Please help us understand.



We really appreciate your help. Thank you.






iambillmccann commented 4 days ago [OREE Build a daily calendar view that shows the appointments for a day. The appointment list shows in the placeholder as in slide 30 of the Lecture 11 slide deck. The appoint list may use the react-calendar package to display the day's calendar. Appointments will come from Google Calendar; Google integration will be a task in a future sprint. For this sprint simply hardcode a small number of appointments. The daily calendar should display times in half-hour increments from 6am to 8pm. The date to display will be received as a prop from the Task View component. PowerPoint Presentation 1 Project kick-off A long descriptive name is better than a short enigmatic name. A long descriptive name is better than a long descriptive comment. Goofy Goobers Kazmi, Murtajiz Kyritsis, Steven Maqsood, Mehak Milloshi, Matea Mojica, Eli Pacheco, Pedro Group Leftovers Acevedo, Gabriela Chodaba, Erik Ehrola, Thomas Singh, Jaspreet Insert Name Here Patel, Dhyey Patel, Karan Patel, Rutvi Jatinkumar Patil, Neel Qureshi, Arij JiNKS George, KellyAnne Jacinto, Jillian Ulep, Sean Yalla, Namitha Mourningwood Desai, Riya Kaur, Avneet McCusker, Ryan Pascual, Gabriel SDF Baig, Safiullah Patel, Vashu Shah, Shriya Srejic, Jemil Dhruve, Keya Team Thoughtless Lanzetti, Thomas Molina Luna, Cristhian Mostafa, Deanna Singh, Akashdeep Thompson, Kevyn The Akatsuki Kansagara, Dhyeykumar Lakshmanan Sathiskumar, Saketh Patel, Manthan Vedagiri, Sai Patel, Shiv The Back Corners Azmi, Rayaan Desai, Manal Regetz, Casey Shirwalker, Neha Suresh, Ritika Working with Git and GitHub Code will be in a central repository on GitHub https://github.com/iambillmccann/crushedit-app Teams shall make as many branches as necessary PRs are due the Friday before the sprint ends This gives time for final code reviews and merging Code must be peer reviewed before merge Breaking changes will not be merged (or will be reverted) Students will not commit to the main branch Agile Development Break the Project into four two-week sprints Sprint 1. Now through March 7th (PRs due March 3rd) Sprint 2. March 7th through March 28th (PRs due March 24th) Sprint 3. March 28th through April 11th (PRs due April 7th) Sprint 4. April 11th through April 25th (PR due April 21st) All teams are working simultaneously on the same project Project will be managed using Kanban Boards on GitHub Project https://github.com/users/iambillmccann/projects/1/views/1 Agile Development Each sprint shall have Sprint demo Opportunity for each team to show off their work Sprint planning Assigning work to each team Off week project updates (2/28, 3/21, 4/4, 4/18) Each team will create a two slide presentation Slide #1. What was completed (by whom) Slide #2. What will be worked on next (by whom) Grading ItemPercentagePoints Coding habits (comments, commits, PRs)30%36 Robust unit testing30%36 Working software (completed on-time)30%36 Final presentation (and reflection)10%12 See the following document for more information ... https://njit.instructure.com/courses/26619/pages/project-overview An app to manage life Task and Time Management App Not a Simple To-do List Based on Established Systems Franklin Planner by Franklin-Covey Free-to-Focus by Michael Hyatt\ Motion - https://www.usemotion.com/ Franklin Planner Paper Planner and Calendar Electronic version is available (and is expensive) Based on ideas from Benjamin Franklin System developed by Stephen Covey Three core principles Spend time planning every day Have your planner with you at all times Work from one calendar Franklin Planner Daily Planning Idea to be clear on goals Determine short term priorities Focus should be on quadrant 2 Franklin Planner Free to Focus Paper only Planning System Claim Research Show Paper Systems are More Effective Focus on Priorities to get More Done Three Steps Stop and get clear on what you’re after Cut the things that don’t serve your vision Act execute the plan you created Free to Focus System Set up the planner; fill in the first couple of weeks Start small and build; begin using daily pages then the goals, etc Make time each day to plan Identify your big 3 (top priority) Make your planner a constant companion Free to Focus Motion Planning App Uses AI to plan your day Integrates your meetings, tasks, and projects Builds your daily schedule They claim your productivity will save you 30 days each year Motion System Complete everything. Motion builds a schedule for you. Stop prioritizing. Motion automatically prioritizes work. No replanning. Motion reschedules undone work. Finish early. Motion ensures you meet deadlines. Forget nothing. Motion tracks all your priorities. Meet less. Motion limits meetings. Focus. Motion guards time for uninterrupted work. One tool. Everything in 1 place. Motion Components Sign in Sign up Profile Task View Calendar View Functions Send Verifications Use Case Verify that the user has entered a valid email address that they have access to. Build a (serverless) function that takes an email address as a parameter and sends a message to that address. The function will generate a unique token to identify the message. The token shall be saved to the user table. The message shall include a link containing the token and email address. Functions Verify Use Case Verify that the user has entered a valid email address that they have access to. Build a RESTful endpoint that will accept a token and email address as parameters If possible, deploy as a serverless function Look up the user by email and verify the that token matches Functions New Day Use Case Track the task list each day by maintaining a separate list of tasks each day. Determine if it is a “new day”. When it is a new day, roll over tasks from the previous day to the current day Completed items do not rollover Task retain their relative priority Functions Calendar Sync Use Case Synchronize the calendar with Google Calendar For any given day, week, or month, use the Google Calendar to populate appointments and event in the planner Implement as a (serverless) function Keep the calendars synchronized in near real-time Use the Google API Project Tips Use Chakra components for the UI Be sure everyone is using the same theme … Chakra default is recommended Agree on the (frontend) data structures for the task list and appointment list Know what source file these are defined in Understand how to use hooks on these lists Project Tips Task Card Status Not started Started Rolled over Complete Deleted Title Urgency (High, Medium, Low) Priority (Sequential Number) Date Project Tips Appointment Card Date Time Duration Title Passwords Follow NIST guidelines Length from 8 to 64 characters Nonstandard characters allowed but not required Entries should not match a prohibited password dictionary* Reset only if the password is compromised or forgotten 38
Answered 2 days AfterFeb 25, 2023

Answer To: So the entire project is to build a planner app but we JUST HAVE TO DO TASK #9 (Screenshot...

Banasree answered on Feb 28 2023
28 Votes
Step 1: Create a new page called "DayView" using the RedwoodJS CLI.
Code:
    yarn rw g page DayView --route
="/day/{date:String}"
This will create a new page component in the web/src/pages/ directory called "DayView" and a corresponding route in the web/src/Routes.js file.
Step 2: In the “DayView” component, import the necessary dependencies and define the component as shown below:
Code:
    // web/src/pages/DayView/DayView.js
import { Calendar, momentLocalizer } from 'react-big-calendar';
import moment from 'moment';
import 'react-big-calendar/lib/css/react-big-calendar.css';
const localizer = momentLocalizer(moment);
const appointments = [
{
title: 'Appointment 1',
start: new Date(2023, 1, 27, 9, 0),
end: new Date(2023, 1, 27, 10, 0),
},
{
title: 'Appointment 2',
start: new Date(2023, 1, 27, 13, 30),
end: new Date(2023, 1, 27, 14, 0),
},
{
title: 'Appointment 3',
start: new Date(2023, 1, 27, 15, 0),
end: new Date(2023, 1, 27, 16, 0),
},
];
const DayView = ({ date }) => {
const events =...
SOLUTION.PDF

Answer To This Question Is Available To Download

Related Questions & Answers

More Questions »

Submit New Assignment

Copy and Paste Your Assignment Here