Jason Leow

Tried Netlify prerendering but didn't seem to help much with Lighthouse scores...anyone had a similar/different experience?

Records updated and propagated in record time, in 1-2h!!! Netlify is niiiice

Lessons learned:
-- don't wait till the end before you do your first deployment. Super stressful and harder to debug.
-- set Nuxt config `target: static` and `generate fallback true` if routing is buggy
-- create and set up your personal access token for Git push to Github
-- things that take time to propagate or approve: DNS records, txn email, any 3rd party services. Set them up waaay beforehand!
--

Solution (for Macs):
-- Create a personal access token in your Github account
-- Open Keychain Access in your Mac, find github item in the table, change the password to the PAT
-- go back to VSCode or terminal to remote push and voila!

Ref:
https://docs.github.com/en/free-pro-team@latest/github/getting-started-with-github/set-up-git#next-steps-authenticating-with-github-from-git

https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/creating-a-personal-access-token

https://docs.github.com/en/free-pro-team@latest/github/using-git/updating-credentials-from-the-macos-keychain

Looks functional...but boring. Must enhance the design later.

Trying to find one that's no to low-code in terms of implementation, easy and fast to deploy, and easy for customers to self-help... Payhere seems like a good middle ground!

-- 2.5% TillyPay for nocode payment with redirect urls
-- 1% Paythen nocode payment with redirect urls
-- 2% Payhere nocode-lowcode-dev payment with npm, APIs, webhooks
-- $15/m + 1.9% Servicebot for lowcode payment embdeddables like plan picker, checkout form, invoice portal
-- $?? Paddle with inline checkout embed
-- Pico $0/m until pass 500 contacts, then $5
-- Stripe client only checkout, least code needed compared to Stripe Checkout (server) and Stripe Elements

This took most of my day! Choosing between packages, seeing which ones were the easiest to implement, trying 3-4 different ones before reverting back to the first one which I previously tried before on Codepen using skypack packages. Then digging deep into learning how to use the functions, setting options. Had to experiment and trial and error a lot to see where best to place the function - nested within the Publish method, or directly in the HTML elements (of which there were some possible places - the publish btn using @click, the success message using a watcher/listener on v-if="success"? SOOO many different ways, so many rabbit holes to tumble into! 😵😩

I initially loved it for helping me write consistent, well-laid out code based on good conventions/best practices. But past few days had been just spending too much time fixing what I think are minor/lame prettier errors that doesn't add much value to the app. The worse was today when I had to fix inline styles disappearing when I refresh the page! It hindered instead of helping, and created more bugs! I didn't even know what went wrong initially and went on a wild goose chase. 🤬WTF. Had to learn this vital piece of commenting - `prettier-ignore` and `eslint-disable`. Must. Remember. This.👇🏻

Took half a day to nest all the code bit by bit in dropdown classes, and then having to re-adjust the spacing because dropdown menus come with different default spaces!😩

👇🏻There, I think I'm finally done with making my own little text editor. It's HELL LOT OF WORK! 😵

Had to add event listeners to the scroll height to automatically increase the style height as lines of text gets typed. Usually we can use `contenteditable` attribute easily for this, but that doesn't work for textarea inputs, and I HAVE to use textarea as I need to use the v-model directive (which only can be used on input kind of fields). So had to dig deeper into how to create my own auto-resizing textarea using Vue! Crazy how this isn't more easily accessible, and that we have to write Javascript functions for it! (It gets even harder if the auto-resizing textarea is a component, because v-model is not directly available on the component. So you have to add more listeners and emit events to do that! I only need the functions on the /write page, so it doesn't make sense to make components for it. A case when it's easier to just type the damn code into the page, than to use the component approach and make everything more complex than it has to.)

Learned how transfer code from one section to another, bit by bit instead of copy-pasting an entire spaghetti block of code over. Move one tiny function over, then another, then another, like building Lego. Much easier - an important learning point! Other simple but useful things learned - how to have a submit button outside of the form element (hint: use id on the form and link the button using form="formID"), and using the dropdown class for Bulma 😯

-- getlifelog.me 🤩
-- getlifelog.com 🤩🤩
-- lifelogger.me 🤩
-- life-log.me 🤩🤩🤩