Web Development Project 1 - Village of Palm Springs Community Board

Submitted by: Roel Crodua

• This web app: This project focus most of events or resources board for my community. The board should display some information about the event or resource. This will apply the use of REACT library focusing on using props and className.

Time spent: 10 hours spent in total

Required Features

The following required functionality is completed:

• The app has a cohesive, unique theme for events or resources relevant to a specific community
  • Header/title describing the theme is displayed
• At least 10 unique events or resources are displayed in a responsive card format
  • There are at least 10 cards displayed
  • The cards should be displayed in an organized format (ex. a grid, or in one line)
  • Each card should include some information about the event or resource

The following optional features are implemented:

• Buttons or links to a related resources are on each card component
  • All cards have buttons or links in addition to text
• The site is responsive for both desktop and mobile formats
  • Web app is shown in a mobile format
  • Video Walkthrough Special Instructions: To ease the grading process, please use Chrome Developer Tools' "Toggle Device" button to demonstrate that your web application's responsiveness in both a desktop and a mobile format. Detailed instructions can be found below this stretch feature on the project page.

The following additional features are implemented:

• Added hover functionality for animation on the game cards and for the buttons
• Added text shadows in the headers.

Video Walkthrough

Here's a walkthrough of implemented required features:

GIF created with Wondershare UniConverter.

Notes

Describe any challenges encountered while building the app.

• Took time in generating the gif file due to file size limit accepted by github repo. The file should not exceed 100mb.
• Designing the page using flex/flexbox and shadows.

License

Copyright 2025 Roel Crodua

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.