outfront

    1.1.1 • Public • Published

    GitHub license PRs Welcome


    Logo

    OutFront JS 🚀

    Console log for mobile browsers.
    See Demo »

    Report Bug · Request Feature · See on NPM

    screenshot-outfront

    OutFront JS - Console log for mobile browsers. | Product Hunt

    About The Project

    OutFront provides an onscreen console for mobile browsers 🔥

    Intercepts all your console.log, console.warn, console.error and errors and logs them into a popup on screen itself(DOM). This can be useful in scenarios where you don't have access to Chrome, Firefox, Edge etc. inspect panels.

    Example scenario to use OutFront JS:

    • You want to debug your webapp in a mobile browser where access to console is not present. Example: Chinese mobile browsers.
    • You want your tester to see console.logs straight on the screen.

    OutFront JS intercepts following console methods currently:

    • console.log
    • console.warn
    • console.error
    • Inbuilt Javascript errors

    Demo

    A demo is worth a thousand words. See demo

    Built With

    OutFront is extremely light weight and built with:

    Getting Started

    OutFront can be used with any web based projects and frameworks such as React, Angular etc.

    Installation

    OutFront requires Node to be installed in order to use yarn/npm.

    • npm
      npm install outfront
    • yarn
      yarn add outfront

    Usage

    After installation import OutFront to your project and call outfront() function on the very top of project tree(for example index.js):

    import React from 'react';
    import ReactDOM from 'react-dom';
    import App from './App';
    import outfront from 'outfront' // import outfront JS
    
    outfront() // Call it on top of project.
    
    ReactDOM.render(
      <HelloMessage name="Taylor" />,
      document.getElementById('container')
    );
    Note: Above example shows usage with React but, OutFront is built with vanilla JS and 
          can be practically used with any JS framework/library.
    

    Roadmap

    See the open issues for a list of proposed features (and known issues).

    Contributing

    Consider starring this project on Github.

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

    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

    License

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

    Icon made by iconixar from www.flaticon.com

    Install

    npm i outfront

    DownloadsWeekly Downloads

    18

    Version

    1.1.1

    License

    ISC

    Unpacked Size

    13.7 kB

    Total Files

    4

    Last publish

    Collaborators

    • paansinghcoder