I built a modern, responsive portfolio website using Next.js for a client working in textile design and craft. The goal of the site is to establish a strong online presence that increases her visibility while highlighting her creativity and professional credibility within the industry.

The website showcases a curated range of her work, including textile art and handbags, presented through a clean, elegant, and user-focused design. Emphasis was placed on visual storytelling and accessibility across all devices.

This project was also a key learning experience, allowing me to deepen my understanding of React, Tailwind CSS, responsive design principles, and deployment workflows, while building a real-world, client-focused application.

Actions

• 🔹 Step 1: Built an interactive website from scratch using Next.js.
• 🔹 Step 2: Structured and styled Next.js components using server-side rendering, Tailwind CSS & Vercel.
• 🔹 Step 3: Deployed the application by pushing the codebase to a GitHub repository and connecting it to Vercel for continuous deployment.

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Learned the structure of Next.js, using props to build components and TypeScript to design page layouts.

  • Used Next.js to make pages more responsive and user-friendly with React state.

  • Deployed the React/Next.js application to Vercel.

  • Bought a domain name and linked it to the Vercel deployment so the site could be accessed on the web.

Future Considerations

• 💡 Potential improvements:

  1. Potentially add a database for user login.

  2. Add a shopping catalogue with items and payment options if the client requests it.

I carried out a data analysis project using real-world sample data to examine the number of volunteers with multiple skills. This project served as a demonstration of what I learned during a volunteer placement with the charity DataKind. It allowed me to test and validate data workflows before applying them to live datasets. As the original project was confidential, this version is a simplified simulation that showcases the tools and processes used. The project was completed using Python, Excel, Jupyter Notebook, and Power BI.

Actions

• 🔹 Step 1: Clean the database and remove duplicates, missing numbers and remove columns to reduce the file size.
• 🔹 Step 2: Use Jupiter Notebook /Python to read in the files look through the data.
• 🔹 Step 3: Visualize the data using Power BI and create plots.
• 🔹 Step 4: Looked at the trends and then put the results on Power BI to create a dashboard.

Result

Below is the result.

GitHub Repository

• 📝 Summary of Key Findings:

  • Using Python to clean spreadsheets and reduce file sizes.

  • Data Visualization.

  • Creating Dashboards using PowerBI.

  • Jupiter Notebook.

Future Considerations

• 💡 Potential improvements:
  1. Further Analysis.

I created data analysis of some real life sample data looking at the Car battery incidents. This was done using Python, Excel, Jupiter notebook and Power BI.

Actions

• 🔹 Step 1: Clean the database and remove duplicates, missing numbers and remove columns to reduce the file size.
• 🔹 Step 2: Use Jupiter Notebook /Python to read in the files look through the data.
• 🔹 Step 3: Visualize the data using Power BI and create plots.
• 🔹 Step 4: Looked at the trends and then put the results on Power BI to create a dashboard.

Result

Below is the result.

GitHub Repository

• 📝 Summary of Key Findings:

  • Using Python to clean spreadsheets and reduce file sizes.

  • Data Visualization.

  • Creating Dashboards using PowerBI.

  • Jupiter Notebook.

Future Considerations

• 💡 Potential improvements:
  1. Further Analysis.

For the Maven Bookshelf Challenge my the task is to design a tool that helps users build their ideal summer reading list. Use Goodreads data to discover and recommend books that fit their unique tastes, from classics to hidden gems, and bring each pick to life with insights from real reviews!

The primary goal was to discover the number of books for each genre and from there I could simply caculate the average ratings. By using the average ratings I could discover which books were popular based off the ratings.

The task involved me cleaning both the spreadsheet as there was alot of unecessary information and blanks. This was simply using using a python script that reads the file and drop columns and rows. Doing this not only cleaned the data up, it also made it faster to read and open the files which is very important especially on github.

What i discovered lastly is fantasy and fiction books were popular at the top end while there was less popularity in historical and non fiction werent.

I am aware the work is light and only a week but this is just using a demonstration what i learned off python recently and its my first attempt.

I made a dashboard using python to interact with. Interactive Maven July 2025 Dashboard

Actions

• 🔹 Step 1: Clean the database and remove duplicates, missing numbers and remove columns to reduce the file size.
• 🔹 Step 2: Use Jupiter Notebook /Python to read in the files look through the data.
• 🔹 Step 3: Visualize the data using Seaborn and create plots.
• 🔹 Step 4: Looked at the trends and then put the results on Streamlit to create a dashboard using python Steam lit.
• 🔹 Step 5: Deployed on Steamlit.

Result

Below is the result.

• 📌 Python Dashboard:

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Using Python to clean spreadsheets and reduce file sizes.

  • Data Visualization.

  • Creating Dashboards using Python.

  • Jupiter Notebook.

Future Considerations

• 💡 Potential improvements:
  1. explore how to deploy in Jupiter notebook for easier viewing.

In a group of 3 we built online e-learning portal for photography enthusiasts.

This was doing using React/Node app which contains the code for an online e-learning portal for users interested in developing photography skills through online courses.

The project includes user signup/login, a node back-end of course and user data, and a React front-end which presents the user with the information to view course information, sign up and view a gallery of previous learners work.

Actions

• 🔹 Step 1: Collabareted and decided roles and responsiblities for each team member.
• 🔹 Step 2: Produced a Wireframe and Planning of the website.
• 🔹 Step 3: Start building the front end (Main page while lialising with other team members working on the back end.)
• 🔹 Step 4: Create the Log in / Sign up page and make sure connects to the backend that stores all the users details and make sure its autheticated with tokens(JWIT).
• 🔹 Step 5: Making sure the course and lessons and review pages are connected to the backend. This was done by checking and reconnecting the routes on the back end and front end (Axios)

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Structure of React and using Props(Components) to design page layouts.

  • Using React to make pages more responsive and user friendly using application states.

  • Creating Database for users, courses and lessons.

  • Linking Api keys using Axios and Server routes.

  • Reploying a react application to Render.

Future Considerations

• 💡 Potential improvements:

  1. Add more payment options which selecting a course.

  2. Improve the look of the site.

I built fashion e-commerce website using React. The site features responsive design, state management with React Context, and navigation using React Router DOM. In addition Daisy UI and tailwind third was used to enhance the look and functionality of the site.

Actions

• 🔹 Step 1: Broswe a catalog of products using filtering options.
• 🔹 Step 2: Add description about individual products.
• 🔹 Step 4: Add items to shopping cart.
• 🔹 Step 5: View shopping cart and manage its contents(add, remove items).
• 🔹 Step 6: Add responsive layout that works seamlessy on mobile and deskstop device(in Progress).

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Using third-party UI frameworks such as Daisy UI to build responsive layouts.

  • Using React context to manage the state for:
  • Products data.

  • Shopping cart contents.

  • Reploying a react application to Render.

Future Considerations

• 💡 Potential improvements:

  1. Add User Authorisation & Database so the user can create an account and interact with the product.

  2. Add payment options and transcations so they can buy the item.

I built a dynamic portoflio. This was done using React. The site shows all the previous projects covering various areas. This was to demonstrated my understanding of React fundamentals, responsive design and component based architecture.

Actions

• 🔹 Step 1: Build a React application from scrath using Node.js.
• 🔹 Step 2: Structered and stylized React components using router & CSS.
• 🔹 Step 3: Deployed the React application using Github repo before pushing it to live server.(Render)

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Structure of React and using Props(Components) to design page layouts.

  • Using React to make pages more responsive and user friendly using application states.

  • Reploying a react application to Render.

Future Considerations

• 💡 Potential improvements:

  1. Add more components such as Gallery Carousal to make the page more interesting.

  2. Explore more use of 3d party Api such as Axios.

Built first full stack application using CRUD operations connected to a MySQL database.

Actions

• 🔹 Step 1: Created an app in Vscode using Node.JS and My SQL to create a database that stores the posts, categories and registered users.
• 🔹 Step 2: Create a register and log in and test the autheication. Additional filter the articles and posts by categories.
• 🔹 Step 3: Add a create, update, delete option for users create and remove posts.
• 🔹 Step 4: Check API calls from web page works before pushing it live server for the app and backend.

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Discovering key finding of using CRUD Operations in the back end using Sequlize & SQL.

  • How to connect to Front end using Node.JS / Express with a MySQL Database.

  • Deploying a full stack application to Render and how to search for platform to host the database.

Future Considerations

• 💡 Potential improvements:

  1. Add implemenation to arrange the post in order by time it was posted.

  2. Add a feature that tells you the name of the user that posted the post, rather then using the default name user.

  3. Make the application look visually more appealing.

In this post, I’m testing to see how this will work.

Actions

• 🔹 Step 1: Build a full stacks application using Vscode using Node.JS.
• 🔹 Step 2: Making sure the APi calls / routes work and that the enter being entered in is store in Json file.
• 🔹 Step 3: Deployed the application using Github repo before pushing it to live server.(Render)

Result

Below is the result.

Live demo

GitHub Repository

• 📝 Summary of Key Findings:

  • Implemented CRUD operations (Create, Read, Update, Delete) for notes.

  • Created a frontend UI that allowed users to add, view, edit, and delete notes.

  • Set up an Express server that serves both API endpoints and static frontend files.

  • Store notes persistently using a JSON files.

Future Considerations

• 💡 Potential improvements:
  1. Idea 1
  2. Idea 2
  3. Idea 3

This creates a README.md generator that you can use for GitHub repositories.

• 📌 Python Git Readme:

Actions

• 🔹 Step 1: Build Readme Generator using python.
• 🔹 Step 2: Implemenet features that write out the message from console to a markdown file or txt.
• 🔹 Step 3: Deployed the application using Github repo before pushing it to live server on GitHub pages.

Result

Below is the result.

GitHub Repository

• 📝 Summary of Key Findings:

  • Using Python dependancies such as Rich table and Pretty to make tables and text.

  • How to use arrays & turples to manipulate data.

  • Creating a file read/ write system that can take input and print it out.

Future Considerations

• 💡 Potential improvements:
  1. Add more visual features to the readme.