Technical Information

No detailed technical information available for this project.

Project Brief

Welcome to my React Portfolio, I will be demonstrating my proficiency in front-end development and user-centric design. This React Built Site, offers a seamless, responsive, and visually experience that displays my understanding of dynamic web applications, React's component-based architecture, responsive user interfaces, state management, and modern development practices.

Technical Information

No detailed technical information available for this project.

Project Brief

Welcome to my game dashborad where you are able view the game I have created with React, css grid or js canvas technics. I will be adding more complexed games to this dashboard and giving a more detailed look in to their structure.

Technical Information

No detailed technical information available for this project.

Project Brief

Technical Information

No detailed technical information available for this project.

Project Brief

Orginisation Application that uses the photo camara.

Technical Information

• Tools and Technologies Used: Backend: PHP (vanilla), MySQL, PDO for database connections
• Application Systems Developed:
• Integrations and External Systems: Frontend: HTML5, CSS3, JavaScript, Bootstrap 5
• Backend Infrastructure:
• Frontend Infrastructure: Features: Session management, user roles (masterAdmin, groupAdmin, user), event management, poster uploads, QR code generation, community resources, points system for challenges
• Security and Stability:
• Technical Challenges and Solutions: Security: Password hashing, session validation, input sanitization, prepared statements
• Performance Enhancements: N/A
• Digital Strategy Planning: N/A

Project Brief

A community-driven calendar platform that allows local groups and organisations to post events, share information, and engage residents. Features include event listings, group following, community challenges, and user engagement tracking. Built with PHP/MySQL and custom CSS/JS.

Technical Information

• Tools and Technologies Used: Backend: PHP, MySQL, PDO for secure database connections
• Application Systems Developed:
• Integrations and External Systems: Frontend: HTML5, CSS3, JavaScript, Bootstrap 5
• Backend Infrastructure:
• Frontend Infrastructure: Features: Role-based access control, document upload/download, file management, user authentication, session management, activity logging, feedback system
• Security and Stability:
• Technical Challenges and Solutions: Security: Password hashing, session validation, role verification, file type restrictions, prepared statements
• Performance Enhancements:
• Digital Strategy Planning: Key Modules: Panel dashboard, document library, noticeboard, job applications, analytics, development feedback hub

Project Brief

A custom-built committee management system featuring:

Panel Dashboard: Central hub with meeting alerts and announcements

Documents Library: Organized storage for minutes, reports, agendas, and accounts

Noticeboard: Committee announcements and updates

Job Applications: Track and manage staff applications

Analytics: Committee engagement and document access stats

Development Area: User feedback and improvement suggestions

Profile Management: Member profiles for record keeping

Meeting Alerts: Automated reminders for upcoming committee meetings

The system is designed to be simple, intuitive, and accessible for committee members of all technical abilities, with information icons guiding users through each area.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: PHP, MySQL, Bootstrap, JavaScript, WooCommerce, PayPal & Stripe Integration.
• Application Systems Developed: Application Systems Developed: E-commerce Platform, Cart Hire System, Order Management System.
• Integrations and External Systems: Integrations and External Systems: PayPal API, Stripe API, WooCommerce.
• Backend Infrastructure: Backend Infrastructure: PHP, MySQL, WooCommerce for Order Management.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, JavaScript, Bootstrap, Responsive Design.
• Security and Stability: Security and Stability: CSRF Protection, SQL Prepared Statements, Secure File Management.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Integration with payment gateways and inventory management.
• Performance Enhancements: Performance Enhancements: Improved checkout flow, optimized load times.
• Digital Strategy Planning: Digital Strategy Planning: SEO Optimizations, Regular Feature Updates.

Project Brief

💼 **Purpose**: To develop a fully functional e-commerce platform for Bains Retro Sweets, providing an online presence and facilitating the sale of retro sweets. The website features a sweetie cart hire system and an easy-to-use product catalog.

📝 **Features**:
- 🍬 **E-commerce Store**: Full product catalog, shopping cart, and payment integration.
- 🛒 **Sweetie Cart Hire System**: Custom booking and rental system for sweet cart hire.
- 💳 **Secure Payment**: Integration with PayPal for secure online payments.
- 📦 **Inventory Management**: Real-time stock management system.

🔧 **Technologies & Skills**:
- E-commerce Solutions
- Payment Integration
- PHP & MySQL
- UI/UX Design

📌 **Outcome**: Delivered a fully functional e-commerce website that enhanced sales and customer experience with secure payment processing and efficient inventory management.

Technical Information

• Tools and Technologies Used: 💻 **Tools and Technologies Used**: PHP, MySQL, Bootstrap, JavaScript, jQuery.
• Application Systems Developed: 🛠️ **Application Systems Developed**: Custom CMS for content management, Newsletter Integration, Resource Directory, Interactive Map.
• Integrations and External Systems: 🔌 **Integrations and External Systems**: N/A.
• Backend Infrastructure: ⚙️ **Backend Infrastructure**: PHP 7.4, MySQL for database management, Custom-built CMS for flexibility.
• Frontend Infrastructure: 🎨 **Frontend Infrastructure**: HTML5, CSS3, Bootstrap for responsive UI, JavaScript, jQuery for dynamic features.
• Security and Stability: 🔒 **Security and Stability**: SQL Prepared Statements for security, secure session management.
• Technical Challenges and Solutions: ⚡ **Technical Challenges and Solutions**: Ensuring smooth user interaction with large data sets and dynamic content management.
• Performance Enhancements: 🚀 **Performance Enhancements**: Optimized content delivery and map data fetching.
• Digital Strategy Planning: 📈 **Digital Strategy Planning**: Focus on accessibility and improving community engagement through easy-to-navigate features.

Project Brief

💼 **Purpose**: To enhance the community’s decision-making processes through efficient data collection and insightful analysis.
📝 **Features**:
- 📰 **Dynamic Content Management**: A custom-built CMS for managing news, updates, and community content.
- 📊 **Newsletter Integration**: Allows automatic sending of community newsletters.
- 🏠 **Resource Directory**: A list of services, events, and community resources for public access.
- 🌍 **Interactive Map**: A feature-rich map highlighting key community locations.

🔧 **Technologies & Skills**:
- Backend: PHP, MySQL.
- Frontend: HTML5, CSS3, JavaScript, jQuery, Bootstrap.

Technical Information

• Tools and Technologies Used: 💼 **Tools and Technologies Used**: PHP, MySQL, Bootstrap, JavaScript, jQuery.
• Application Systems Developed: 📋 **Application Systems Developed**: Website, Custom CMS for easy content management.
• Integrations and External Systems: 🔗 **Integrations and External Systems**: None.
• Backend Infrastructure: 🔧 **Backend Infrastructure**: PHP 8, MySQL, Secure File Handling, Custom CMS.
• Frontend Infrastructure: 💻 **Frontend Infrastructure**: HTML5, CSS3, JavaScript, Bootstrap.
• Security and Stability: 🔒 **Security and Stability**: Secure Session Management, Input Validation.
• Technical Challenges and Solutions: ⚙️ **Technical Challenges and Solutions**: Custom CMS implementation, SEO optimization.
• Performance Enhancements: 🚀 **Performance Enhancements**: Optimized website loading speed, improved mobile responsiveness.
• Digital Strategy Planning: 📈 **Digital Strategy Planning**: Focus on SEO optimization and mobile-first design.

Project Brief

💼 **Purpose**: To provide a centralized, easy-to-use platform for managing and displaying Sandy’s Community Centre content. This website integrates a custom CMS for effortless content updates and features a robust data gathering system for community surveys.

📝 **Features**:
- 🌐 **Custom CMS**: Enables admins to update pages, posts, and media content easily.
- 📊 **Survey Data Collection**: Gathering and analyzing community feedback for improved services.
- 🛠️ **Content Management**: Full control over managing sections, articles, and community data.

🔧 **Technologies & Skills**:
- Web Development
- Content Management Systems (CMS)
- Survey Integration
- Data Analytics

📌 **Outcome**: Developed a user-friendly CMS to streamline content management, enhancing community engagement and facilitating strategic decision-making.

Technical Information

• Tools and Technologies Used:
• Application Systems Developed: 💼 **Purpose**: To streamline the process of generating and managing user feedback efficiently.
• Integrations and External Systems:
• Backend Infrastructure: 📝 **Features**:
• Frontend Infrastructure: - 📝 **Survey Creation**: Easily create and manage surveys tailored to specific needs.
• Security and Stability: - 🧩 **Data Aggregation**: Collect feedback and generate reports.
• Technical Challenges and Solutions: - 🛠️ **Admin Controls**: Admin panel for managing surveys and reviewing collected data.
• Performance Enhancements:
• Digital Strategy Planning: 🔧 **Technologies & Skills**:

Project Brief

💼 **Purpose**: To streamline the process of generating and managing QR codes for various events and community engagement activities. The application allows for the creation, management, and tracking of event-specific QR codes, making it easy for attendees to access event details, surveys, and other important resources quickly.

📝 **Features**:
- 📊 **QR Code Generation**: Create dynamic QR codes for multiple event types.
- 🔍 **Event Tracking**: Monitor the usage and effectiveness of each QR code, gathering data on attendee engagement.
- 📅 **Event Scheduling**: Users can schedule events and automatically generate QR codes for them.

🔧 **Technologies & Skills**:
- Database Management
- QR Code Generation
- Backend Integration
- Event Tracking
- Analytics

📌 **Outcome**: Delivered an efficient tool for event organizers, enabling them to manage event participation and feedback through dynamic QR code generation and usage analytics.

Technical Information

• Tools and Technologies Used:
• Application Systems Developed: 💼 **Purpose**: To enhance the community’s decision-making process through efficient data collection and insightful analysis.
• Integrations and External Systems:
• Backend Infrastructure: 📝 **Features**:
• Frontend Infrastructure: - 📊 **Survey Management**: Enables creation of structured surveys and polls for various community needs.
• Security and Stability: - 📈 **Data Analysis Tools**: Provides insights from collected data, aiding better decision-making.
• Technical Challenges and Solutions: - 🔐 **Data Security**: Ensures the integrity of data through secure storage and encryption.
• Performance Enhancements: - 🎨 **User Interface**: Simple and accessible design aimed at increasing participation and ease of use.
• Digital Strategy Planning:

Project Brief

💼 Purpose: To enhance the community’s decision-making processes through efficient data collection and insightful analysis.



📝 Features:

- 📊 Structured Surveys & Polls: Customizable templates for various feedback needs.

- 📈 Data Analysis Tools: Extract actionable insights for improved strategic planning.

- 🔐 Security & Storage: Ensures data integrity and accessibility through secure storage mechanisms.

- 🎨 UI/UX Design: Crafted for accessibility and user-friendliness, encouraging high engagement.

- 🌐 Scalable Architecture: Supports diverse survey needs and expands functionality as required.



🔧 Technologies & Skills:

- Database Management

- UI/UX Design

- Backend Integration

- Analytical Reporting

- Security Protocols



📌 Outcome: Delivered a tailored solution aligned with the organization’s objectives, enabling robust data-driven decision-making.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: PHP, MySQL, Bootstrap, JavaScript, Content Management System.
• Application Systems Developed: Application Systems Developed: Community Event Management System, CMS for Dynamic Content.
• Integrations and External Systems: Integrations and External Systems: Google Analytics, Social Media Sharing.
• Backend Infrastructure: Backend Infrastructure: PHP, MySQL for Dynamic Content Management.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, JavaScript, Bootstrap, Responsive Design.
• Security and Stability: Security and Stability: SQL Prepared Statements, Session Management, Secure Content Management.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Managing large data sets and ensuring security.
• Performance Enhancements: Performance Enhancements: Optimized load times for faster content delivery.
• Digital Strategy Planning: Digital Strategy Planning: Focused on community engagement and content strategy.

Project Brief

💼 **Purpose**: To empower the community through collaboration, creativity, and celebration. The Craigmillar Festival website provides a platform for event management, community outreach, and digital collaboration. It serves as a hub for festival schedules, activities, and cultural initiatives.

📝 **Features**:
- 📅 **Event Listings**: Display upcoming festival events with detailed schedules.
- 🎨 **Multimedia Integration**: Showcase multimedia content such as images and videos from the festival.
- 📝 **Community Engagement**: Allows users to contribute content, suggestions, and feedback.
- 🔍 **Search Functionality**: Easy navigation and search for specific festival activities.

🔧 **Technologies & Skills**:
- Full-stack Development
- Event Management Systems
- User-Generated Content
- Responsive Design

📌 **Outcome**: Created a digital presence for the Craigmillar Festival, fostering community involvement and participation in cultural activities.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: JavaScript, HTML, CSS, Game Development, DOM Manipulation, Event Handling.
• Application Systems Developed: Application Systems Developed: Memory Matching Game, User Interaction.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: JavaScript, HTML, CSS, DOM Manipulation.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Game logic for matching cards and resetting game state.
• Performance Enhancements: Performance Enhancements: Optimized for quick UI response and minimal delay.
• Digital Strategy Planning: Digital Strategy Planning: User-centered design for a fun and challenging experience.

Project Brief

💼 **Purpose**: To create an interactive and engaging memory game, aimed at enhancing cognitive skills through pattern recognition and memory exercises.

📝 **Features**:
- 🧠 **Memory Challenge**: The game provides an enjoyable way for users to test and improve their memory by matching pairs of cards.
- 🎮 **User-Friendly Interface**: Simple and intuitive design ensuring an easy learning curve for users of all ages.
- ⏳ **Timed Challenges**: Tracks time taken to complete the game, providing a challenge for users to improve their performance.
- 🏆 **Score Tracking**: Keeps track of user scores to foster a competitive spirit and progress tracking.

🔧 **Technologies & Skills**:
- Frontend Development (JavaScript, HTML, CSS)
- Game Development Principles
- Web Design and User Experience (UI/UX)

📌 **Outcome**: Delivered an engaging memory game that fosters brain exercise through a fun and interactive interface, perfect for users of all ages.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: HTML5, CSS3, Web Accessibility, SEO Fundamentals.
• Application Systems Developed: Application Systems Developed: Basic Web Page Structures, Responsive Web Design.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, SEO Fundamentals.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Learning web accessibility standards and applying them.
• Performance Enhancements: Performance Enhancements: Optimized for mobile-first design and SEO-friendly structure.
• Digital Strategy Planning: Digital Strategy Planning: Ensured content was accessible and search-engine friendly.

Project Brief

💼 **Purpose**: To complete the EdX HTML Certification, gaining a comprehensive understanding of HTML5 fundamentals for web development.

📝 **Features**:
- 📄 **HTML Structure**: Learning and applying fundamental HTML5 elements to create well-structured web pages.
- 📚 **Web Accessibility**: Implementing best practices for accessibility and user-friendly web design.
- 🛠️ **SEO Fundamentals**: Introduction to SEO techniques and ensuring web pages are optimized for search engines.

🔧 **Technologies & Skills**:
- HTML5
- CSS3
- Web Accessibility

📌 **Outcome**: Successfully completed the certification and gained solid foundational skills in HTML5 and web accessibility.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: HTML5, CSS3, Accessibility Standards, WCAG Guidelines, ARIA.
• Application Systems Developed: Application Systems Developed: Accessible Web Pages, User Interface Accessibility Enhancements.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, Accessibility, ARIA.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Applying web accessibility standards (WCAG).
• Performance Enhancements: Performance Enhancements: Optimized for screen readers, keyboard navigation.
• Digital Strategy Planning: Digital Strategy Planning: Focused on making content accessible to all users.

Project Brief

💼 **Purpose**: To complete the W3C Introduction to Web Accessibility course, focusing on the fundamentals of web accessibility and designing inclusive websites that are usable by people with various disabilities.

📝 **Features**:
- 🌐 **Web Accessibility Principles**: Learned how to apply WCAG (Web Content Accessibility Guidelines) to improve website accessibility for all users, regardless of their disabilities.
- ♿ **Assistive Technologies**: Gained knowledge of how different assistive technologies work, such as screen readers, and how to design content that is compatible with these tools.
- 📱 **Accessible Web Design**: Applied principles of accessible design, including proper contrast, keyboard navigation, and alternative text for images.

🔧 **Technologies & Skills**:
- Web Accessibility
- WCAG (Web Content Accessibility Guidelines)
- Assistive Technology
- HTML & CSS Best Practices

📌 **Outcome**: Successfully completed the W3Cx course, acquiring the knowledge and skills necessary to create accessible websites and applications for a diverse user base.

Technical Information

• Tools and Technologies Used: Tools and Technologies Used: Node.js, Express.js, MongoDB, React, RESTful APIs, JWT Authentication, HTTPS.
• Application Systems Developed: Application Systems Developed: Environmental Data System, Community Engagement Tools, Data Analysis Dashboard.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: Node.js, Express, MongoDB.
• Frontend Infrastructure: Frontend Infrastructure: React, Bootstrap, Axios for API calls.
• Security and Stability: Security and Stability: HTTPS, JWT Authentication, Data Validation.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Implementing secure login and managing real-time data.
• Performance Enhancements: Performance Enhancements: Reduced Server Response Time, Optimized API Calls.
• Digital Strategy Planning: Digital Strategy Planning: Focused on environmental data reporting and user interaction.

Project Brief

💼 Purpose: To streamline environmental, social, and governance (ESG) data collection and reporting for The East Synergy Group (ESG), offering a scalable solution for tracking ESG compliance.

📝 **Features**:
- 🏢 **ESG Data Collection**: Collecting detailed data on environmental, social, and governance efforts across multiple organizations.
- 📈 **Reporting**: Generating customized ESG reports to support compliance, audits, and strategic decisions.
- 🧑‍💻 **User-Friendly Interface**: Intuitive interface to input and track ESG metrics over time.
- 🔐 **Data Security**: Ensuring secure data storage and transfer using HTTPS and secure authentication methods.

🔧 **Technologies & Skills**:
- Node.js
- Express.js
- MongoDB
- React

📌 **Outcome**: Delivered a fully operational ESG data management platform for compliance and reporting, streamlining the tracking process for sustainable practices.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: HTML5, CSS3, JavaScript, CSS Grid Layout, Responsive Design.
• Application Systems Developed: Application Systems Developed: Interactive Snake Game, Dynamic Grid Layout.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, JavaScript, CSS Grid Layout.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Handling real-time grid updates and managing snake movement.
• Performance Enhancements: Performance Enhancements: Optimized grid for smooth gameplay and quick load times.
• Digital Strategy Planning: Digital Strategy Planning: Focused on intuitive controls and responsive design.

Project Brief

💼 **Purpose**: To provide a simple, intuitive application for generating CSS grid layouts with ease, making it easier for developers to implement grid-based designs.

📝 **Features**:
- 🎮 **CSS Grid Generation**: A tool for generating CSS grid layouts dynamically.
- 🖥️ **Responsive Design**: Ensures that generated grids are responsive, providing an optimal layout on different devices.
- 🧩 **Customization**: Allows users to customize grid settings such as rows, columns, and gaps.

🔧 **Technologies & Skills**:
- HTML5
- CSS3
- JavaScript
- CSS Grid Layout

📌 **Outcome**: Delivered a tool that streamlines CSS grid generation, making it easier for developers to create responsive grid-based layouts.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: JavaScript, HTML, CSS, Game Development, Event Handling.
• Application Systems Developed: Application Systems Developed: Interactive Tetris Game, Real-Time User Inputs.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: JavaScript, HTML, CSS, Event Handling.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Game logic for piece movement and rotation.
• Performance Enhancements: Performance Enhancements: Optimized for smooth transitions and animations.
• Digital Strategy Planning: Digital Strategy Planning: Focused on user interaction and providing a classic game experience.

Project Brief

💼 **Purpose**: To build an interactive Tetris game, offering users a classic puzzle game experience with a modern, responsive web interface.

📝 **Features**:
- 🎮 **Classic Tetris Gameplay**: Players can rotate and position falling blocks to complete rows and score points.
- ⏱️ **Time Challenge Mode**: A time-based challenge mode for more experienced players.
- 🏆 **Scoreboard**: Tracks user scores, encouraging users to compete for the best performance.
- 📱 **Responsive Design**: The game is optimized for both desktop and mobile devices for a seamless user experience.

🔧 **Technologies & Skills**:
- JavaScript for game logic and functionality
- HTML5 Canvas for rendering the game
- Responsive Web Design using CSS

📌 **Outcome**: Delivered a fully functional, responsive Tetris game that blends nostalgia with modern web technologies, providing a fun challenge for users.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: JavaScript, HTML5, CSS3, DOM Manipulation, Event Handling.
• Application Systems Developed: Application Systems Developed: Interactive UI, Dynamic Content Rendering.
• Integrations and External Systems: Integrations and External Systems: N/A.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: HTML5, CSS3, JavaScript, DOM Manipulation.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Handling user inputs and dynamic updates.
• Performance Enhancements: Performance Enhancements: Optimized for fast interaction and minimal lag.
• Digital Strategy Planning: Digital Strategy Planning: User-centered design for a seamless experience.

Project Brief

💼 **Purpose**: To showcase my foundational JavaScript skills and demonstrate my ability to create interactive web applications.

📝 **Features**:
- 🎮 **Interactive Components**: Showcasing various interactive elements such as dynamic forms, data visualization, and user input handling.
- 🚀 **JavaScript Fundamentals**: A variety of JavaScript concepts such as DOM manipulation, event handling, and data handling.

🔧 **Technologies & Skills**:
- JavaScript
- HTML5
- CSS3

📌 **Outcome**: A solid demonstration of my foundational skills in JavaScript, providing a dynamic and engaging user experience.

Technical Information

• Tools and Technologies Used: ? **Tools and Technologies Used**: React, JavaScript, JSX, React Hooks, State Management, Responsive Web Design.
• Application Systems Developed: Application Systems Developed: Interactive Web Applications, State-Driven UI, Dynamic Content Updates.
• Integrations and External Systems: Integrations and External Systems: React Router, Axios for API Calls.
• Backend Infrastructure: Backend Infrastructure: N/A.
• Frontend Infrastructure: Frontend Infrastructure: React, JSX, React Hooks, JavaScript, Responsive Design with CSS.
• Security and Stability: Security and Stability: N/A.
• Technical Challenges and Solutions: Technical Challenges and Solutions: Managing state with hooks and handling API requests.
• Performance Enhancements: Performance Enhancements: Lazy loading, code splitting for faster loading times.
• Digital Strategy Planning: Digital Strategy Planning: Focus on reusable components for scalable apps.

Project Brief

💼 **Purpose**: To demonstrate my understanding of frontend development using React, building interactive user interfaces with dynamic components.

📝 **Features**:
- ⚡ **React Components**: Showcasing reusable and dynamic UI components built with React.
- 🛠️ **State Management**: Implementing state management to handle data and updates to the UI seamlessly.
- 💡 **Performance Optimization**: Ensuring that the application runs efficiently with React.

🔧 **Technologies & Skills**:
- React
- JavaScript
- JSX
- State Management (React Hooks)

📌 **Outcome**: Successfully built a fully functional, interactive application using React, demonstrating skills in modern frontend development.

Technical Information

• Tools and Technologies Used: 💻 Tools: PHP, MySQL, Bootstrap, Custom Auth, CKEditor
• Application Systems Developed: N/A
• Integrations and External Systems: N/A
• Backend Infrastructure: N/A
• Frontend Infrastructure: N/A
• Security and Stability: N/A
• Technical Challenges and Solutions: N/A
• Performance Enhancements: N/A
• Digital Strategy Planning: N/A

Project Brief

💼 Purpose: To allow Sandy’s team to manage the website and services easily.

Technical Information

• Tools and Technologies Used: 💻 Tools: PHP, MySQL, Chart.js, Bootstrap
• Application Systems Developed: N/A
• Integrations and External Systems: N/A
• Backend Infrastructure: N/A
• Frontend Infrastructure: N/A
• Security and Stability: N/A
• Technical Challenges and Solutions: N/A
• Performance Enhancements: N/A
• Digital Strategy Planning: N/A

Project Brief

💼 Purpose: To monitor community outcome KPIs through data dashboards.

Technical Information

• Tools and Technologies Used: The system was built using PHP with PDO for secure database interaction and Bootstrap 5 for responsive design. File uploads are validated and securely stored on the server. Admin alerts use PHPMailer with SMTP credentials managed in a secure configuration file. The CMS interface includes viewing, downloading, and managing applications with modal controls, and enforces GDPR-compliant retention policies.
• Application Systems Developed: N/A
• Integrations and External Systems: N/A
• Backend Infrastructure: N/A
• Frontend Infrastructure: N/A
• Security and Stability: N/A
• Technical Challenges and Solutions: N/A
• Performance Enhancements: N/A
• Digital Strategy Planning: N/A

Project Brief

The Sandy’s Job Application System was developed to provide a streamlined, accessible, and secure digital platform for handling recruitment at Sandy’s Community Centre. Designed initially for the Operations Support Lead role [Ref: JD/OSL/18032025], this system simplifies the end-to-end application process for both applicants and administrators.

Applicants are directed to the job post via a prominently placed popup advert. They can easily submit their CV, a short personal statement, and agree to a GDPR-compliant data policy. The form supports PDF, DOC, and DOCX uploads and is designed with clear accessibility and mobile-friendly features.

Key features include:

Automated email alerts sent to the admin upon each submission.

Data retention policy with clear applicant consent.

Secure file upload system, storing documents safely for 6 months.

A CMS admin dashboard where staff can view applications, read personal statements, and download CVs directly.

The system supports Sandy’s broader mission by offering a professional, user-friendly application portal that respects data protection and promotes inclusive access. It reduces administrative burden and ensures consistency and transparency in the hiring process.

Technical Information

• Tools and Technologies Used: 💻 Tools: PHP, MySQL, Admin Auth, CKEditor, Bootstrap
• Application Systems Developed: N/A
• Integrations and External Systems: N/A
• Backend Infrastructure: N/A
• Frontend Infrastructure: N/A
• Security and Stability: N/A
• Technical Challenges and Solutions: N/A
• Performance Enhancements: N/A
• Digital Strategy Planning: N/A

Project Brief

💼 Purpose: To support community editors with user-friendly site management.