Technical background of wait/delay/sleep Programmers who have been coding in PHP or C# can look in JavaScript for functions like wait or sleep or delay. Functions like that just freeze running application in certain place for a given time and, next, continue code execution from that place. But in JavaScript there are no built-in methods…
Category: tips front-end
Popover on hover in VueJS
Hi! I will create in this short tutorial a popover (sometimes named as tooltip) component in VueJS. I didn’t use in my example any third-party library, like Bootstrap or Vue Bootstrap. This is a pure tooltip/popover component in VueJS just with JavaScript usage. Why it is better to create your own popover in VueJS than…
VueJS background image URL
Using CSS image as background in HTML element is quite obvious situation. You can do that for example as text background, for slides in carousel (slider), for articles in its listing and in many many cases. In many cases you will have one single component which must display correct data with correct background image. Than…
Iframe and parent window postMessage communication
Quite common situation is that we place part of the content of our site in IFRAME tag which is linked with another page, typically, in the same domain as our main page. This is a very common idea when we are building a bigger application which is build of micro-front-ends (micro-front-end is an architecture pattern…
Vue Router for application hosted on static server
I will show in this article how to start using Vue Router in Vue CLI project with very basic settings which will allow to host your application on normal static server (like apache on e.g. GoDaddy). What we want to achieve here is the following scenario: We have our VueJS application created in Vue CLI…
Vue CLI: modify webpack configuration
When using Vue CLI sometimes we must change how it is working in background. I mean what are the bundling rules, how server works etc. We must know that Vue CLI uses in background the Webpack with quite sophisticated settings. But we can use dive into that and change whatever we want. Let’s go step…
How to start using Webpack + TypeScript
I will show in this article how to use Webpack for bundling our front-end JavaScript projects. Webpack is a tool which allows us to code our JavaScript front-end application and divide our code on modules, separated files with view (html), logic (js) and styles (css), and gather all files into single html, javascript and css…
FIREBASE: integrate ADMIN SDK with NodeJS back-end API
In our first article about Firebase here I described how to create Firebase account, how to add it to our project and how to deploy whole project on Firebase hosting. In my second article about Firebase I described how to integrate Firebase user authentication service. So – two previous articles are about integration or Front-end…
FIREBASE: AUTHENTICATION IN WEB APP
In our previous article about Firebase here we described how to create Firebase account, how to add it to our project and how to deploy whole project on Firebase hosting. We added here to our project Firebase user authentication service. And here we will continue that – we will integrate Firebase authentication inside our web…
FIREBASE: Add Firebase to your JavaScrpt project + Firebase CLI installation + Firebase hosting deploy
I will focus in this article on important part of work when you, as front-end developer, want to make in your own project users authentication add based on that, give them access to your back-end API in Node.js. But as you are front-end developer, you are not a specialist in security of back-end applications and…