Ad

Monday, January 18, 2021

Debug Google Cloud Error - Failed to enable API please make sure you have the IAM permission to enable API

 If you are not expecting this message,  and think you have the permission to enable API read on. Before using Google Cloud services, generally we will have to enable the API by searching for it and toggle enable. This is great for permission and cost management. 

Failed to enable API please make sure you have the IAM permission to enable API

If you have the right permissions but still run into this issue, these problems could be the culprit:


  • Your account does not have billing enabled yet. Set up billing. And often Google offers a generous free quota or trial. This may change though.
  • Select the right project to work on. Double check top left of the Cloud console shows the project you are expecting.
  • Your access needs to be owner role or have the ability to create resources.
  • You can check this in the IAM dashboard. 

Friday, January 8, 2021

Modern JavaScript ECMAScript ES6

 ES6, modern JavaScript in year 2020 and 2021, is short for ECMAScript version 6. It is pronounced Ehk, Ma, Script 6. It is a standard, spec drafted by an European consortium for web technology and advancement, by convention. Developers call modern javascript ES6 to distinguish from the old ways, and signal that new conventions are involved: arrow function, and semicolons are optional. One can write a book on ES6. This blog post focuses on getting started quickly, with the basics, know just enough to be effective.

undefined : refers to the variable exists but is not defined yet.

null : exists and hasn't been explicitly set.

primitive type : means there's no method attached to it the data type. Not to be confused with the objects that usually work on primitive types. A good example of primitive type is booleans true false. There's no distinguishing float vs int just number - the unified type for all numbers. Every thing is a double 64 bits.

Implication of the number type is, there are only 64 bits so large numbers don't fit. Can use exponent notation as work around. No float also means not accurate in calculation, no floating point precision. 

promise : is a first class citizen, is native to modern javascript. It is the new pattern to use, instead of callbacks (event driven, could result in callback hell, code can be unorganized,indented). A great use case is to retrieve data from APIs. Promise is an object.

let promise = myfunction(request)

Instead to get a callback, ask the function for a promise.

You might also seen fetch() being used, but that's also the slightly older way. fetch() is native to javascript and supports promise. 

Promise can have states, status PENDING, FULFILLED (successfully resolved), REJECTED (error). Can check the promise object for states.                

Instead of constantly checking the status, we can use then() and catch() in conjunction with promise to handle next steps. 


then() accepts a function as input. Will call the function when the promise preceding it is fulfilled. 

Callbacks : the old event driven way could cause nested, or long sequence code, or a callback calling another callback, hard to manage, read, not sustainable. 

var variableName : var is familiar syntax, if omitted var then a global variable is created.  If you haven't given the variable a value at declaration, it will be undefined. If the system has to make a placeholder, the initial value is null. 

Event: commonly used event types, when adding EventListener: 'load', 'unload', 'change', 'click' etc.
MDN https://developer.mozilla.org/en-US/docs/Web/Events


Eventloop :  The javascript event loop constantly check if the stack is empty, if yes, it will check if there's anything on the queue to be put on the stack.


Date :  new Date() generate the current date time stamp. 


Return default disable automatic browser behavior like event propagation, prevent default

Commonly used JavaScript functions:

vanilla javascript functions 

toUpperCase

toLowerCase

indexOf

lastIndexOf

charAt opposite of indexof

ES6 include template strings


React UI, UI UX, Reactstrap React Bootstrap

React UI MATERIAL  Install yarn add @material-ui/icons Reactstrap FORMS. Controlled Forms. Uncontrolled Forms.  Columns, grid