Programmer Path

Programmer Path is a Learning Management System project that content creators can easily use to reach their students and audience.

Comment

Inspiration

Programmer Path is a project of a Learning Management System. The main inspiration for this project is to directly connect content creators with their audience.

What it does

Programmer Path provides a variety of technical courses that are created and hosted on the website. Students can easily enroll in courses.

How we built it

This application is built with cutting-edge technologies such as Next JS for the front-end, StepZen GraphQL for the middleware API, and Postgres for the database. Clerk is also used as an authentication provider. This is a design system inspired by Jamstck.

Challenges we ran into

I am a front-end developer who consumes data from a back-end system using Rest API. This is the first time I've fully explored GraphQL in the context of full-stack web development. Initially, concepts like Queries and Mutations, as well as the type system, overwhelm me. However, as I gained hands-on experience with the StepZen GraphQL, I gradually adapted to the ecosystem. StepZen reduced the learning curve for GraphQL by automatically generating schema and hosting it.

Accomplishments that we're proud of

3 accomplishments, I would like to mention are

  • Able to quickly adapt to the GraphQL eco-system
  • Able to understand the Schema design and add own queries
  • Good Planning and day-to-day learning, as well as the ability to complete the project within the deadlines

What we learned

I personally learned a lot from this Hackathon, and I'd like to highlight three key points.

  • GraphQL technical aspects and application design using this cutting-edge technology
  • How to securely retrieve and modify data from a Next JS application without exposing the StepZen Admin key on the client side, as well as make it real-time by utilizing the useSWR hook
  • Create responsive layouts with Chakra UI and Next JS, and make the pages SEO friendly.

What's next for Programmer Path

From here, I'd like to take a step back and analyze and take notes on everything I've learned, particularly StepZen, GraphQL, and the data retrieval part of the front-end. After that, I have a few plans to add more features, such as Stripe payments and leveraging the StepZen Graph, to make this application more robust. I'd like to use StepZen graph as a single graph that does more than just queries and mutations, and I'd like to mix it with other API endpoints such as Google Translate API, Stripe payments API, and so on.

Built With

Share this project:

Updates