Praxis
hero-bg
hero-bg

Praxis

Description

Praxis is an online platform designed to connect aspiring developers with other developers or experienced mentors through real-world projects. It offers a unique blend of learning and collaboration opportunities, allowing users to enhance their skills, network, and gain practical experience.

Stack

Typescript

React

Next.js

Payload CMS

MongoDB

Tailwind

Flowbite UI

blob hero

Current Features

  • User Authentication: Users can sign up, log in, and log out, with password hashing and salting for security.
  • Project Creation: Users can create and edit projects.
  • Project filter: Users can filter projects based on relevant categories.
  • Upload files: Users can upload and remove files for their projects.
  • Content Management System (CMS): The CMS allows for easy management of the app's content, including user and project data.

Project Purpose and Goal

Praxis is designed to bridge the gap between learning and real-world experience for developers and designers. Through project-based collaborations, it allows aspiring learners to connect with each other and with experienced mentors, facilitating a dynamic environment where members can grow their skills, share knowledge, and contribute to open-source projects.

Web Stack and Explanation

Praxis features a modern tech stack that ensures the platform is future-proof and capable of handling complex user relationships and data management needs. It uses React at its core, with Next.js 13’s server components enhancing the efficiency of initial data rendering. This is complemented by the use of SWR for efficient, client-side data fetching, allowing for seamless data updates without reloading the page.

Payload CMS offers a headless, highly customizable content management system with user authentication and an admin dashboard for database interaction. It also provides a variety of useful backend features that speed up development time. Tailwind CSS streamlines the UI development along with Flowbite UI.

The back end is powered by MongoDB, while AWS S3 provides cloud storage for the platform's assets.

Problems and Thought Process

Developing Praxis made me more aware of the complexities of web development. I initially had trouble managing multiple tasks and integrating different technologies. Often, the effort needed for minor changes was underestimated, requiring a higher grasp of the project's interconnected parts. In response, I adopted a strategy of tackling tasks sequentially and in isolation.

Relying on boilerplate solutions at the beginning turned out to be inefficient due to the excessive customization and time required to adapt it to the app. The decision to build from the ground up not only deepened my understanding of the codebase but also allowed me to make the most of modern development tools and libraries, which would be better long term.

Initially, I explored integrating the Payload CMS backend directly into the Next.js codebase, thinking it would streamline development and reduce overhead, but i quickly realized its complexity and limitations given a lack of documentation. After research, I went the more traditional route and kept the Payload CMS backend as a separate codebase. This allowed for the structure to be more understandable and the code more manageable, aligning with best practices for scalability and maintenance.

Handling the many-to-many relationships between users and projects in Praxis required a strategic approach in the backend. I developed a database schema with junction tables to efficiently manage these complex connections and purposely designed it to allow for future features.

My approach was to focus on core functionalities first to build a viable MVP, making development stages more manageable. The entire journey of creating Praxis was not just about overcoming technical hurdles but also about the importance of strategic planning, adaptability, and the ongoing pursuit of learning.

Lessons Learned

Developing Praxis was a transformative journey that greatly expanded my capabilities as a developer. Most of all, I learned the importance of meticulous planning. This process involved crafting detailed schemas and strategic documents to underpin the app's architecture, informed by extensive research.

Throughout this journey, AI served as an invaluable programming partner. By consistently engaging with AI to reflect on my thought process, I cultivated a synergistic partnership where AI acted as a second brain. I found the AI to be not just useful for generating code, but as feedback for my thought processes while building the app allowing me to reflect on my decisions and improve my approach.

At one point I began to have doubt regarding the project's value, guiding me towards pivoting to an MVP model instead of building out features that may not be wanted.

The journey was longer than expected, but the depth of knowledge and experience I gained is invaluable. I emerged from this project with a profound sense of growth, feeling as though my experience as a developer has doubled. Now that I have these insights and skills, I am confident in my ability to embark on future projects with greater speed and efficiency.

Other Projects

project

Audiophile

Frontend

An online store for ordering headphones and speakers.

See more
project

CoffeeRoasters

Frontend

An online subscription service for a Coffee brand.

See more
blob
Site designed and coded by Bryan Lee
[object Object]