/cfood

Primary LanguageVue

c.food online store

This digital store is open-source and built openly by kb (Kabolobari Benakole) from "open-sourced" technologies and generous contributions and help from both free and premium tutorials, blogs, and courses.

Technologies

  • Nuxt 3
  • Vue 3
  • TailwindCSS
  • Gitlab
  • Supabase (SQL, PostgreSQL)
  • Storyblok

Summaries of code used

How to pull up to date main into dev branch

My own shorthand, all in one fell swoop.

git checkout branch-name; git fetch origin; git merge origin/main;

Link to this is down in References & credits.

How do I delete a branch both locally and remotely?

From source:

git push -d <remote_name> <branchname>
git branch -d <branchname>

Note: In most cases, <remote_name> will be origin.

My shorthand:

git push -d origin branch-name; git branch -d branch-name

How to rename a branch locally/remotely

In one fell swoop:

git branch -m old-name new-name; git push origin -d old-name; git push origin -u new-name;

Nuxt 3 authentication with Supabase

At the time when doing this was fuzzy, Feb 12, 2023, this tutorial came in handy, with good code samples how to authenticate "users" into Nuxt 3 app with supabase, and then publishing such "profiles" to own table on supabase.

At this same time, I intend to research more on the subject to be sure it can handle my brief fully -- as customers create account at the cfood.studio, their accounts should be pushed to the customers table on supabase. Of course, when they actually order, they'll be "upserted" to same table and their order to the orders table, these actions only happening as they can now be authenticated having already registered (and are signed in when they purchase).

How do I ensure password is a certain length and mix of characters javascript

My answer, of course, came from this Stack Overflow link, Javascript regular expression password validation having special characters. But, from the same search, this other resource here at, Regex for password must contain at least eight characters, at least one number and both lower and uppercase letters and special characters seems to be chockfull of options for this kind of stuff. Thanks to all on SO for contributing!

Key learnings or lessons learned

Calling a composable that async/awaits itself inside own composable may error

And it was reading through comments here (Error thrown nuxt instance unavailable, when use useState after useFetch in composable) that helped me fix my own errors regarding this one

References & credits

  1. Build and deploy a static online shop with Nuxt3 using Pinia Store and Stripe Checkout to Firebase
  2. Seed, simplicity of cart page as inspiration
  3. How To Make A Input Number / Counter With Tailwind CSS From Scratch
  4. How to build an E-commerce Store with Nuxt.js and Strapi
  5. Because I love crazy class/style bindings in Vue!
  6. Shopping Carts: Two column with quantity dropdown
  7. Product Overviews: Split with image
  8. Promo Sections: Full-width with overlapping image tiles
  9. Nuxt Context: where is it in Nuxt 3
  10. Beautiful Tailwind gradient generator
  11. Regexp to check if file type is image
  12. Embed SVG as a cool section divider
  13. Global State Management with Pinia In Nuxt 3
  14. How to push local code to new branch on gitlab. need specific steps (looks like a duplicate question but i need some specific steps)
  15. -u is shorthand for --set-upstream first push to create matching local branch on remote
  16. How to "git pull" from master into the development branch
  17. How do I delete a Git branch locally and remotely?
  18. How to Rename a Branch in Git
  19. Nuxt 3 authentication with Supabase
  20. Nuxt 3 authentication with Supabase
  21. Error thrown nuxt instance unavailable, when use useState after useFetch in composable
  22. More Tailwind configs grabbable samples