API-Glue

A dashboard with some included projects
The dependencies with integrated code environment
The area where you can view tests (test suites with test cases)

Inspiration

I love to make things, and I get a sense of pride in showing them to other people! Therefore, I have a bunch of projects that I have hosted on different websites. These websites all use different dependencies / external APIs and it's the worst feeling ever when something breaks! I would always hope there would just be 1 place I could view all these different dependencies and track how they're doing.

What it does

APIGlue allows you to add your "projects" and view if all the dependencies are up and running. You can add dependencies by heading into "View Dependencies", adding a title for a dependency, and then modifying a sample function to make a request to the API. You can customize what is considered "passing", as well as the response value! Additionally, you can link files with test cases and check if your project not only passes for its external dependencies, but internal dependencies as well! Meaning that APIGlue doubles as a testing framework that shows you if your local tests passed or failed.

How we built it

I (solo contributor) built it using React.js in the frontend, Express.js for the backend, and CodeMirror for the code integration. This is meant to be a local developer tool. There are 2 key methods of "storage", the first being a file called "AppGlueConfig.json" which stores any names of projects, any dependencies a project has, and any linked testing file (an attached path) a project has. The other key method of storage is the "projects" folder, which stores each project as a subfolder with a "dependencies.js" file that holds all the code for a project.

Challenges we ran into

There was so much file modification involved, and I ended up having to study up on a lot of regex to be able to create, delete, and modify functions directly in the application. A great bit of effort went into the code integration. Also, there was so much house keeping involved trying to keep the code clean, as the project came out to be a bit larger than I anticipated.

Accomplishments that we're proud of

I'm very proud of how it turned out. I wanted a tool like this for so long and I'm excited to use it. I originally thought the best I could get out of it was the functionality, but the aesthetic is pretty ok to me!

What we learned

I learned a lot about regex, file modification with fs, more familiarity with project configuration, and what it's like to work in a pressured setting. Honestly, learning about the code integration is very useful as I may likely use it again one day.