Month: February 2022

Posted on

Vue3 w/pinia, bootstrap5 and axios | my memo

Finally updated my mentality to Vue 3. I’ve updated my Mac OS from Catalina to Monterey a while ago and started to thinking about software update accordingly. The big one was Node, I’ve been using the version 12 for such a long time, so decided to update to v16. Thanks to nvm, I can switch versions when I needed. And started to try Vue3.

Vue3, Vite server, it’s just amazingly FAST!!! I’m loving it. 

> npm init vue@latest
> npm run dev

So far, trying to get familiar with update and I’ve encounter an axios issue. I’ve install axios and vue-axios. According to https://stackoverflow.com/questions/68233550/what-is-the-different-between-axios-vue-axios. “vue-axios is just a wrapper, exposing axios to components as this.axios, this.$http, or Vue.axios.”

import axios from "axios";
import VueAxios from 'vue-axios'
app.use(VueAxios, axios);

app.mount("#app");

// with in a component add this
add(payload) {
const path = "URL";
this.axios.post(path, payload)
.then(() => {

I’ll update when I noticed something converting from vue2 to VUE3

Posted on

PowerPoint Path Animation

I wonder how often you make an animation. Maybe not so frequently or not consciously. How about PowerPoint or a similar presentation software?

PowerPoint has a set of pre-made animations, and you can apply to a text or image. I think people are pretty familiar to apply these animations.<br> <b>How about “Path Animation”?Perhaps you don’t use it so regularly, but it’s sometimes very effective. One tip that I recommend who is not familiar with the Path Animation, it’s better to choose “ARCS” instead of “LINES”, because A “LINE” has only a start and an end point, no point in between and you cannot add another editing point later. So you cannot edit the path shape later.

Once you select an image or text box, apply “ARCS” path, it plays automatically once. Then Right-Click and select “Edit Points” to edit the path.

The path is called a “Bézier curve“. You can edit the curvature with the selected edit point to move around and use handles’ both side to control the curvature tangent(direction).

You can add or delete an edit point for the path until you are satisfied the flow.

Also, if you add another animation preset such as “Grow/Shrink”, then set the “Timing” to “Start [with previous]”.

You can animate the path Move(Transition) and Grow/Shrink at the same time.

Sometimes too much animation will destroy the entire presentation, so use animation efficiently.

Enjoy!

THIS VIDEO in YOUTUBE: https://youtu.be/36R1Ak–51c