vrtpro / chocolattech Goto Github PK

This website is mobile-first design. But if it's on tablet devices, the card looks smaller and the image aren't readable for some users in tablet device.

Specify and create a breakpoint design for tablets, enlarge the card, text, etc.

Consider using <link rel=preload> to prioritize fetching resources that are currently requested later in page load.

By preloading, browser doesn't need to fetch the image when the page load, but the image are fetched while page load (prioritized) and when the page loads, the image is already loaded too.

This impact performance diagnostic audits.

This font is having big size (from pagespeed insight). It does impact performance issues (now the score is 86 on mobile). I am searching an alternative fonts to replace this font.

The margin left is not working, and how about move the toast to bottom on mobile screen?

Hello there, Falcxxdev here.
I just wanna tell u guys, Something good is happening to me!

😮 What happens?

This project is got submitted as gift for her (It's opened yesterday on her Birthday Stream).
She checked, opened, reviewed this website on her stream and reading my-submitten message. She likes it and will be using this website as secondary website (first is still carrd.co version made by herself).

It's more than enough if this website is only reviewed and opened by her. At least she knows the landing page and it's content. But i got more more things from these expectation. I was given thanks by herself, I got an aprreciation, she likes it, and more!
If you are curious, Watch the Stream here (Already marked with timestamp).

🤔 What's next?

I will take an serious-level of Search Engine Optimization (SEO) adventages by using some ready-to-use nuxt modules.
Why? I want to rank up this website to make her more being recognized as a virtual youtuber on internet & world wide, introducing her to more people that interested with virtual youtubers so she can grow up more bigger and can reach lots of her goals.

The conclusion is, I want to help her grew up more by rank-up this website to next & more serious-level of SEO.

I didn't know or experienced on advanced-level of SEO. I just know & experienced on basic SEO like, opengraph, twitter, and meta tags and doesn't know about schema.org, breadcrumbs, schema.org identity, etc.

But this will be a nice adventure for me to exploring more things about Optimizing an website on Search Engines.
This will be worked from time to time. I will learn about it and apply it to this project.

I will pour all my knowledge in SEO for this project. I will dedicate this once-more for my-precious & gorgeous oujo-sama, Choco Latte.

That's all.

I don't know much about SEO. But this thing is quite annoying. It took 6s (6090 ms) time to load FCP in 3G devices. This thing very impacting to the performance score, and SEO.

The README file is not currently having a development step. And if #4 done before this issue, make sure to update the readme with including banner image and badges from shields.

Pre-requisites? #6 must be done first if this want to be worked.

Build a bunch of text and very informative text to announce to Twitter. Make sure to search for a help to people who interested to contribute to this project by firing the current available issues together. 🔥

⚠️ Disclaimer

This will be a breaking changes from many aspects, such as concepts, styles, typography, and content inside this project.

📄 Issue Description

This is not an issues at all. This is a planning page with further information about the progress of the plan in this project.

So, I recently saw her twitter page. She says if there is no re-tweets / likes progress on her "Reveal re-debut model" puzzles tweets. She is now planning to post piece per piece of the puzzle until she re-debut. (see the tweet here).

Then, i saw something that "mindblowing" on youtube.

Guess what, she will do her re-debut at February 14, 2023.

🤔 Thennnn....

I am really need to finish the Version 1 Project with it's "breaking changes" before February 14, 2023. I will made more efforts contributions on this project to release and get done the Version 1 Project before the deadline. I have ~1 month remaining to complete this plan.

❓ Why I want to do this

Yes, this project is got noticed by her in this tweet. According to my promise on Roadmap (it's on README), I will do a Version 1 Project Release if this project got noticed and got published to Twitter.

Now this is done perfectly and I will do it.

😴 What's next?

This issues requires further information about how is the project's progress goes. question labels will applied in this issue. You just need to wait for the Version 1 Release because it will be more overpower from previous projects.

🤔 Why replaced

Luckily, our oujo-sama, Choco Latte sends me some helps. She sends me an Google Drive link that containing any assets she uses on her stream. It contains original model (packed with .rar file), some arts, signatures, logos, expression sheet, and model mode sheet. Everything is wrapped up inside that Google Drive link.

To be honest, I am very helped with these things. I can use any original assets within her permission, and she allows even letting me to use these assets.

Makasiiiiii oujo-sama ku tercinta 🥺🥺🥺

Create a custom banner, opengraph image using Figma. Use available resources you need on #png-choco-latte channel.

To improve accessibility, specify an aria-label attribute to navigation links, such as back button.

Create a .github folder. Create a simple CI to check something, initialize renovate bot to doing regular package upgrade.

Additional checks to make sure if vite builds minimized and optimized. Having low size file, etc.

I am currently using arbitrary values inside a component files, using it in inline class, and repeated it. So the code is now spammed with *-[...] things. I don't want this. What i want is, it has registred as class by extending to the tailwindcss.config.cjs config file.

I have bg-[#ACACAC], when i need it on another element, I don't want to repeat the same way. Copying this code and paste it inside another class="...". I want this thing is registred as new class and using it like bg-my-own-grey so it can be more readable by newbies or people that only understanding css and it's syntax.

I will fix this issue when i want but if anyone is interested in helping, feel free. Just fork, made your changes, and send a PR.

🤔 The Problem

This seems to be a bug with the framework itself. I didn't know what's happening on the framework's repo & what's the problem but when I am trying with Nuxt v3.0.0, it works. The <NuxtLoadingIndicator /> component seems to be visible on routing event.

But when I am upgrading the Nuxt version to 3.1.0 | 3.2.0 | 3.2.2 (Current), this component is not visible and does not showing on routing event.

I wonder why this happens. Maybe there's a breaking changes or this is a bug that currently happening on the framework.
Well, if anyone can help something, It will be very appreciated!

🖥️ Environments

👨🏻‍💻 Local device

OS: Linux Ubuntu 22.10
WM: sway
Node: v18.14.1
pnpm: v7.27.1
Editor: Visual Studio Code - Insiders

☁️ Vercel deployments

OS: Linux ???
WM: - (headless)
Node: v18.x
pnpm: v7.x
Editor: - (none)

I was thinking "how if the content is moved to cms?", It is because this website is still using static content data that written directly into *.vue files. If there's a things to be editted, I must be openning code editor, searching for the file, formatting file, and make a new commit into master branch. However, this cycle is complicated. I just thinking if should I move any contents in this website to CMS?

Moving to CMS gives you lot adventages. It allows us to edit content directly in the CMS and any published changes will be applied to the website automatically, without any changes with source code. This is because our website consumes and fetch the content from the CMS.

And this is a more-useful adventage, It allows authenticated user to make changes to the contents. I think it will be great if Choco (herself) can make changes to the contents too. So it's like a "Editor" role that allowed to make any changes to contents.

What CMS? I don't know. There's a lot CMS-provider out there. I'm just thinking about it right now.
I have 2 experiences in using CMS

1. Using Strapi's CMS
   It allows us to self-host the CMS on our local machine or our cloud. But some troubles in using this CMS is limitance in cloud usage. This requires a node-server to be running 24/7, and I am a free user of any services here. When I'm using Railway, I have an limit 20 days free quota. So this CMS will be shutted down when it reached it's limit and the client will stopped working too. I have to wait until 1st day in month to have it cycle resetted and running again.

2. Using Sanity's CMS
   It allows us to edit the content in Studio-separated application and the whole contents in their clouds. These things eliminates previous problems in using Strapi's but, I don't know if this CMS does have and allows us to create multiple user and roles. I will have to check it later, and any updates will be announced here. Thanks.

I am not totally sure about this web's responsive. It's fine on my SM-G935F phone because it has wider screen. I don't know how it is on smaller screen so I need to re-check it before totally launch.