Git Product home page Git Product logo

brianconfantomes-v2's Introduction

๐Ÿ‘‹ I am Kayle Robson

Software Developer

Driven by community, ideas, and continual learning

โš’๏ธ Skills

Languages: Javascript, HTML5, Python, SQL, C, C#

Libraries and Frameworks: Node.js, Express.js, Tailwind, Formik, Framer Motion, MUI, Boostrap, Axios, Sass, React.js, Flutter

Databases: MongoDB, Mongoose, MySQL, AWS

Web Protocols: RESTful, JSON, HTTP

Soft Skills: Communicator, Problem-solver, Continuous Learner, Team Player, Creative, Organized, Planner, Agile Methodologies

Dev Tools: Git, Github

Project Showcase

Project progression over the last 3 years

Intergalactic Planetary - Learn about the Solar System

https://intergalactic-planetary.netlify.app/

Backend | Frontend

Intergalactic Planetary was meticulously crafted as an ambitious endeavor for a thrilling week-long hackathon. The team, consisting of three highly skilled and passionate developers, united through the dynamic Hackathon discord channel. With their unwavering dedication and boundless creativity, they embarked on an exhilarating journey, meticulously shaping a captivating idea. The team's meticulous planning involved the creation of tickets and tasks, seamlessly organized through a Trello board. Furthermore, they maintained daily communication via Discord, fostering a harmonious synergy that propelled the project forward.

The hackathon presented a unique challenge: to create a full-stack application that would enable students to delve into the awe-inspiring realm of the solar system. As an added twist, the team was required to style all the planets using CSS alone, showcasing their mastery of front-end design. Moreover, each planet was given its own distinctive page, brimming with captivating and distinct information, offering a comprehensive learning experience for students. To bring this vision to life, the team employed cutting-edge technologies. The React framework was chosen to power the dynamic front-end, ensuring a seamless and interactive user interface. For the back-end infrastructure, a robust MySQL database was meticulously designed and implemented, leveraging the power of AWS for hosting and scalability. Amidst fierce competition from five exceptional teams, we humbly stand as the triumphant victors.

galaticgif

Tech Stack Frontend

  • React JS

  • Sass โ€“ All planets were created only use Sass, images and image laying was not allowed.

Backend

  • NodeJS, Express - Entire backend was built to handle charts/ genre data, user accounts, shareable links, and many more features.

  • AWS

  • MySQL



Briancon Fantomes - Version 2

https://brianconfantomes.com

Frontend

Briancon Fantomes is an exceptional audio tour business nestled in the charming locale of Briancon, France. As a fully functional business page, it offers visitors an immersive experience through captivating audio tours available in both French and English, complemented by a comprehensive map highlighting all the tour stops.

To maximize its online presence and reach, the website cleverly utilizes cross-referencing with popular platforms such as Google, Facebook, Instagram, TripAdvisor, and Spotify. This strategic integration not only enhances the visibility of Briancon Fantomes but also amplifies its Search Engine Optimization (SEO), ensuring that it garners the attention it deserves.

To enhance the user experience, the page leverages the power of remarkable npm libraries such as Framer-motion and React-audio-player. These libraries contribute to the seamless navigation and immersive audio playback, elevating the overall quality of the audio tour experience.

Aesthetically, the website exudes elegance and modernity with its stylish design, thanks to the utilization of the Tailwind CSS framework. This choice of styling enhances the visual appeal and ensures a delightful browsing experience for visitors. Effortlessly catering to the needs of a diverse audience, the website incorporates separate JSON files to store text content in both French and English. This intelligent design allows for easy language switching, facilitated by React useContext. Visitors can select their preferred language within the navbar, and the application dynamically adapts to their choice. Furthermore, to streamline the experience, the selected language preference is conveniently saved within the user's browser settings, providing a personalized and seamless browsing experience upon subsequent visits.

Briancon Fantomes stands as a shining example of a meticulously crafted audio tour business, seamlessly blending technology, captivating storytelling, and innovative design. It not only showcases the beauty and history of Briancon but also serves as a gateway for visitors to immerse themselves in an unforgettable journey through time and culture.

ezgif com-crop (4)

Tech Stack Frontend

  • React JS

  • Framer Motion

  • Tailwind

  • React useContext - to manage language change which refers to a json file where the french and english version of the website are kept.

  • React-audio-player - a npm library which plays the audio files



Operation Mother Earth

https://operation-mother-earth.netlify.app/

Backend | Frontend

Operation Mother Earth is an innovative and comprehensive full-stack application designed to educate children about the pressing issue of electronic waste. Rooted in React, this multi-page application seamlessly leverages MongoDB as its robust and reliable database.
The application features three engaging sections, each with a unique purpose. The Storyboard Game section invites children on an interactive journey, allowing them to explore the world of electronic waste through captivating storytelling. The Electronic Waste Recycling Center Finder uses Google APIs to locate recycling centers within a 10km radius of the user. The results are then mapped onto the interactive map and listed below the map. The user can also add an e-waste recycling center to the map, using Google API Geocode. The Education section further enhances learning through a combination of engaging videos and informative Q&A sessions. Users can add their questions to the database, which will be answered at a later time.

E-waste Center

ezgif com-crop (1)

Game

ezgif com-crop (3)

Education

ezgif com-crop (2)

Tech Stack Frontend

  • React JS

  • Framer Motion

  • Sass

  • Formik

  • MUI

Backend

  • MongoDB

  • Express

  • Node

  • Google APIs

  • RESTful APIs

  • Mongoose



Instock

Instock was a group assignment where we were tasked with creating a full-stack application that enables users to perform CRUD operations on multiple pages connected to a single database. The application allows users to add, remove, and edit warehouses in an existing warehouse list, as well as manage items stocked within each warehouse. The frontend was developed using React, while the backend was built with Node.js and Express. For data storage, we utilized a JSON file stored on the backend, which was accessed through the RESTful APIs we developed.

Backend | Frontend

ezgif com-video-to-gif (2)

ezgif com-video-to-gif (1)

Tech Stack Frontend

  • React JS

  • Sass โ€“ All planets were created only use Sass, images and image laying was not allowed.

Backend

  • NodeJS

  • Express

  • Axios

  • RESTrul APIs



Bike Briancon Version 2

https://revyrob.github.io/bikeBriancon/

Frontend

Bike Briancon is a biking application for Serre Chevalier which is located near Briancon, France. This application was created by recording my own data and scraping bike trail data. I built this application by sel-learning different tools, such as HTML, CSS, Bootstrap, and QGIS.

ezgif com-crop (5)

Tech Stack Frontend

  • HTML5

  • CSS

  • Boostrap

  • Javasript

  • QGIS - built with the Open Source program QGIS. Added the gps data for the trails, added the geolocation for the user, and the click-able trail index. The QGIS map had a conversion to web.

brianconfantomes-v2's People

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.