/NexTrace

NexTrace is a VS Code Extension that tracks network requests and collects console.log statements with file navigation built in for easy performance monitoring / debugging for your Next.js App.

Primary LanguageJavaScriptMIT LicenseMIT

AppVeyor contributions welcome

Nextrace

Contributors Forks Stargazers Issues MIT License LinkedIn


Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Roadmap
  5. Contributing
  6. License
  7. Contact
  8. Acknowledgments

About The Project

Nextrace is a HTTP Request Performance Monitoring tool that helps you to identify and troubleshoot performance bottlenecks in your Next.js app. All HTTP requests (server and client) from running your Next.js app are displayed in one place with their associated observability metrics along with intuitive visualizations of the data. All console.log statements are collected and displayed together with buttons that automatically navigate you to its respective file.

(back to top)

Getting Started

Prerequisites

First, install dependencies in your Next.js app:

npm install nextrace

Installation

Search for Nextrace in VSCode Extension Marketplace and click Install.

(back to top)

Usage

1.) Click on NexTrace Logo
2.) Click Choose File Button to select entry point to your Next.js application
3.) Click Choose Root Button to select your app folder (note: this folder should not be your project folder as it contains node_modules containing a large number of files. Instead select your app folder containing the entry point of your application)
4.) Click Start to start tracking your application's network requests

5.) Click Logs to display additional panel for your console logs for easy file Navigation
6.) When finished, click STOP.
7.) Optional: Incase of any issues removing boiler plate code, select your file and root as you did on steps 2 & 3 and click Clean Files buttton to remove boiler plate code.

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Your Name - NexTrace10@gmail.com

Project Link: https://github.com/oslabs-beta/NexTrace

(back to top)

Built With

JavaScript React NPM NodeJS Express WebSocket MUI OpenTelemetry d3js Webpack Babel Visual Studio Code

NexTrace Contributors

Accelerated by OS Labs and devloped by Charles Dunlap, Connor Keyes, Simon Lin, & Jose Velasco.