Creating Module with API Key/Secret



  • I read the “Head first developing MM module for extreme beginners” but I am still confused how I can configure it.

    I want to create a MM-Yelp

    I created my app on Yelp Fusion and I have an api_key and secret. Where do I store this api_key? My main.js or into my node_helper.js?

    Sorry, I am a total beginner with JS



  • @lilpkstud U put the default config in the module. If the helper needs it, the module sends it down

    See my Sample module.

    https://github.com/sdetweil/SampleModule


  • Project Sponsor

    @lilpkstud said in Creating Module with API Key/Secret:

    My main.js or into my node_helper.js?

    Neither nor.
    You would create a string variable for both in the module defaults.
    THen in config.js which is only present on your device and not shared via github or else, you can overwrite the empty variable with your api_key and secret.
    There are loads of examples, a few coming to my mind are MMM-Strava or MMM-DarkSkyForecast (or nearly any other weather app.


  • Project Sponsor

    @lilpkstud Taking MMM-Strava as an example:

    MMM-Strava.js (the main js file)

    Module.register("MMM-Strava", {
        // Default module config.
        defaults: {
            client_id: "",
            client_secret: "",
            period: "recent",   
            ...
    
    

    config.js:

            //disabled: true,
            module: 'MMM-Strava',
            position: 'center',
            config: {
                client_id: "my_id",
                client_secret: "hereisthesecrethidden",
    
    


  • @lavolp3 Thanks for the example I will look into it more

    However, is there a way to put my request token inside of the request header?


  • Project Sponsor

    @lilpkstud
    Well, you can call any variable from your config/defaults using the reference this.config.variable.
    Or this.config.requestToken respectively.

    Something important to remember:
    Sometimes, e.g. when you use a callback function, note that the this reference may change (better: the context changes).
    Therefore you will often see something like this in the module codes early in a function:

    self = this
    

    And later on in the callback function

    self.config.requestToken
    

    Here, the “this” instance that is bound to its context, gives it’s properties to the global variable “self” that can then be used in any context (because it is global).

    For (much) more information check out https://scotch.io/@alZami/understanding-this-in-javascript



  • Having trouble displaying the information that I received from Yelp API

     getDom: function() {
            var self = this;
            var wrapper = document.createElement("div");
            //If this.dataRequest is not empty
            if(this.data && this.data.length > 0){
                console.log("MMM-Test: This.data is set" + this.data);
            
                //Name of Business
                var wrapperDataRequest = document.createElement("h1");
                wrapperDataRequest.innerHTML = this.data;
                wrapperDataRequest.className = 'yelpBusinessName';
    
                wrapper.appendChild(imgDataRequest);
                wrapper.appendChild(wrapperDataRequest);
            } else {
                console.log("MMM-Test: this.data couldn't be found");
                wrapper.innerHTML = "This didn't work";
            }
            
            return wrapper;
    	},
    
    MMM-Test: This.data is set{"id":"E8RJkjfdcwgtyoPMjQ_Olg","alias":"four-barrel-coffee-san-francisco","name":"Four Barrel Coffee","image_url":"https://s3-media1.fl.yelpcdn.com/bphoto/-_Ks4eF8aZcm3GZgUf5Urg/o.jpg","is_closed":false,"url":"https://www.yelp.com/biz/four-barrel-coffee-san-francisco?adjust_creative=joufChkTQP-Ru-G_5cRrMA&utm_campaign=yelp_api_v3&utm_medium=api_v3_business_search&utm_source=joufChkTQP-Ru-G_5cRrMA","review_count":2069,"categories":[{"alias":"coffee","title":"Coffee & Tea"}],"rating":4,"coordinates":{"latitude":37.7670169511878,"longitude":-122.42184275},"transactions":[],"price":"$","location":{"address1":"375 Valencia St","address2":"","address3":"","city":"San Francisco","zip_code":"94103","country":"US","state":"CA","display_address":["375 Valencia St","San Francisco, CA 94103"]},"phone":"+14158964289","display_phone":"(415) 896-4289","distance":1452.8696502343696}
    

    How can I display name?

    I tried this.data[0].name or this.data.name but no luck


  • Project Sponsor

    @lilpkstud this.data is an object, not an array. So this.data.name should do the trick. In the code above you have only this.data!?



  • @lavolp3 I deleted this.data.name because I was getting undefined and I still am



  • @lavolp3

    This line of code will show a { on my mirror so I’m assuming everything is turned into a string?

    I used JSON.stringify() in my node_helper file

                wrapperDataRequest.innerHTML = this.data[0];