React Intern Assignment : School Website

Objective

The goal of this assignment is to evaluate your design and development skills, your
understanding of React.js, and your ability to follow specific requirements and guidelines. You
are tasked with creating a website for a school that adheres to guidelines and showcases your
proficiency in frontend development technologies.

Assignment Details

Create a fully functional and responsive website for a school. The website should include the
following sections:

1. Home Page
○ Introduction to the school, including its name, logo, and a brief description.
○ A carousel or a banner showcasing key highlights or events.
○ Quick links to important sections of the website.
2. About Us
○ Detailed information about the school's history, vision, mission, and values.
○ Message from the principal or head of the institution.
○ Information about the school's infrastructure and facilities.
3. Academics
○ Information about the curriculum offered (e.g., primary, secondary, senior
secondary).
○ Details of various subjects taught at different levels.
○ Information about teaching methodologies and educational resources.
4. Admissions
○ Admission process and criteria.
○ Downloadable admission forms.
○ Important dates and deadlines for admission.
5. Faculty
○ Profiles of the teaching and administrative staff.
○ Qualifications and experience of the faculty members.
6. Students
○ Information about student life, including extracurricular activities, clubs, and
societies.
○ Achievements and accolades of the students.
○ Student council and leadership opportunities.
7. Gallery
○ Photo and video gallery showcasing school events, activities, and infrastructure.
○ Functionality to filter gallery by event type or date.
8. Contact Us
 ○ School’s address, contact numbers, email, and a contact form.
○ Google Maps integration for location.

Technical Requirements

● React.js: Utilize React.js for building the website. Ensure proper use of React
components, hooks, and state management.
● Responsive Design: The website must be fully responsive and work seamlessly on
various devices (desktops, tablets, and mobiles).
● CSS Framework: Use a modern CSS framework (e.g., Bootstrap, Tailwind CSS) for
styling and layout.
● Routing: Implement client-side routing using react-router-dom or a similar library.
● State Management: Use a state management solution like Redux or Context API for
managing the application state.
● Form Handling: Properly handle form inputs and validations, especially in the
admissions and contact sections.
● Accessibility: Ensure the website is accessible to users with disabilities. Follow best
practices for web accessibility (e.g., ARIA roles, keyboard navigation).
● Performance: Optimize the website for performance, including lazy loading of images
and components.

Evaluation Criteria

● Design and User Experience: Aesthetics, layout, navigation, and user-friendliness of

the website.
● Code Quality: Cleanliness, readability, and maintainability of the code. Proper use of
React.js features and best practices.
● Functionality: Completeness and correctness of the implemented features as per the
requirements.
● Responsiveness: Compatibility and usability across different devices and screen sizes.
● Creativity and Innovation: Unique design elements, interactive features, and innovative
use of technology.

Submission Guidelines

● Repository: Create a GitHub repository for your project and share the link.
● ReadMe: Include a README file with instructions on how to set up and run the project,
as well as any additional notes or documentation.
● Deployment: Deploy the website on a platform like Vercel, Netlify, or GitHub Pages and
provide the live link.

Submission Link : https://forms.gle/srFVtSu2xc44iPpo6

Additional Notes
 ● You are free to use any additional libraries or tools that you find necessary, but ensure
they add value to the project.
● Pay attention to detail and make sure the website is polished and professional.
● Think about the end users (students, parents, faculty) and ensure the website meets
their needs and expectations.

Good luck, and we look forward to seeing your creative and technical skills in action!

============================================================

Dummy Data for School Website Assignment

Here is a set of dummy data you can use to populate the website. This data includes
information about the school, faculty, students, and other sections required for the assignment.

Home Page

● School Name: Springdale Public School

● Logo: logo.png (use a placeholder image)
● Introduction: "Welcome to Springdale Public School, where we nurture young minds for
a brighter future."
● Carousel/Banner Highlights:
○ "Annual Sports Day - Celebrating Excellence in Sports"
○ "Science Exhibition - Showcasing Student Innovations"
○ "Cultural Fest - Embracing Diversity and Creativity"

About Us

● History: "Founded in 1985, Springdale Public School has been dedicated to providing
quality education and holistic development to students."
● Vision: "To create a learning environment that fosters academic excellence, critical
thinking, and ethical values."
● Mission: "To empower students with the knowledge, skills, and values needed to thrive
in a dynamic world."
● Principal's Message: "At Springdale, we believe in nurturing the potential of every
student and guiding them towards a successful future."
● Infrastructure and Facilities:
○ "State-of-the-art science and computer labs"
○ "Spacious and well-equipped classrooms"
○ "Library with a vast collection of books and digital resources"
○ "Sports facilities including a playground, gymnasium, and swimming pool"

Academics
 ● Curriculum:
○ Primary (Grades 1-5): English, Mathematics, Science, Social Studies, Art,
Physical Education
○ Secondary (Grades 6-10): English, Mathematics, Science (Physics, Chemistry,
Biology), Social Studies, Computer Science, Physical Education, Art
○ Senior Secondary (Grades 11-12):
■ Science Stream: Physics, Chemistry, Biology, Mathematics, Computer
Science, English
■ Commerce Stream: Accountancy, Business Studies, Economics,
Mathematics, English
● Teaching Methodologies: "We use a blend of traditional and modern teaching
techniques to cater to different learning styles."
● Educational Resources: "Digital classrooms, interactive learning modules, and access
to online educational platforms."

Admissions

● Process: "Admission forms are available for download. Submit the completed form
along with required documents at the school office."
● Criteria: "Admission is based on merit and availability of seats. Entrance tests may be
conducted for certain grades."
● Important Dates:
○ "Admission Form Availability: March 1st"
○ "Last Date for Submission: March 31st"
○ "Entrance Test: April 15th"
○ "Announcement of Results: April 30th"

Faculty

● Profiles:
○ John Doe: Principal, M.Ed, 20 years of experience in educational administration.
○ Jane Smith: Vice Principal, M.Sc. in Physics, 15 years of teaching experience.
○ Emily Johnson: English Teacher, M.A. in English, 10 years of teaching
experience.
○ Michael Brown: Mathematics Teacher, M.Sc. in Mathematics, 8 years of
teaching experience.
○ Sophia Davis: Science Teacher, M.Sc. in Chemistry, 12 years of teaching
experience.
○ David Wilson: Computer Science Teacher, B.Tech in Computer Science, 5 years
of teaching experience.

Students

● Life at Springdale:
 ○ Extracurricular Activities: "Music, Dance, Drama, Art, Sports, Robotics, Debate
Club, Science Club"
○ Clubs and Societies: "Literary Society, Environmental Club, Astronomy Club,
Coding Club"
● Achievements:
○ "John Smith - National Level Math Olympiad Winner"
○ "Sarah Lee - Gold Medalist in State Swimming Championship"
○ "Tech Innovators Club - Winners of Inter-School Robotics Competition"
● Student Council:
○ President: Amy Parker, Grade 12
○ Vice President: Rajiv Mehta, Grade 11
○ Secretary: Lisa Wong, Grade 10

Gallery

● Photos:
○ sports_day.jpg: "Students participating in various sports events."
○ science_exhibition.jpg: "Students presenting their science projects."
○ cultural_fest.jpg: "Students performing in the cultural fest."
○ classroom.jpg: "A glimpse of our interactive classrooms."
○ library.jpg: "Students reading and studying in the school library."
● Videos:
○ school_tour.mp4: "Virtual tour of Springdale Public School."
○ annual_function.mp4: "Highlights from the Annual Function 2023."

Contact Us

● Address: "Springdale Public School, 123 Education Lane, Cityville, State, ZIP Code"
● Phone: "+1 (123) 456-7890"
● Email: "[email protected]"
● Contact Form:
○ Name
○ Email
○ Message
● Google Maps Integration: Embed the location using Google Maps iframe.

Additional Notes

● Use placeholder images and videos where necessary. You can find free placeholders on
websites like placeholder.com or unsplash.com.
● For the Google Maps integration, you can use an iframe with a dummy address.
● Ensure all dummy data is used consistently across the website to maintain coherence.

Feel free to modify or expand this data as needed to fit your design and development process.