Vite assets are still localhost on production server

If you are using vite.js (for example when using Laravel assets bundler) then running the npm run build command triggers the build process for your project. When you run this command, Vite.js will perform several tasks to prepare your application for production deployment.

If you use Git and upload/deploy your files to production server and you css is not working then check the source code.  If you see something like this on your production server :

<script type="module" src="http://127.0.0.1:4523/@vite/client"></script>
<script type="module" src="http://127.0.0.1:4523/resources/js/app.js"></script></code>

then check if the “hot” file was accidentally uploaded to your server (github) to your Laravel public folder. Delete it and it should work. This file is used when running the dev server but will break production.

To exclude this file being uploaded to github you add it to .gitignore file:

/public/hot

Is it better to make several commits and then push to github or push each commit immediately?

The decision of whether to make several commits and then push to GitHub or push each commit immediately depends on your workflow and the nature of the changes you are making. Both approaches have their merits, and the choice ultimately depends on your preferences and the collaboration model of your project.

1. Making Several Commits and Pushing at Once:

  • Advantages:
    • Cleaner History: Grouping related changes into separate commits can create a more organized and meaningful commit history, making it easier to understand the evolution of the project.
    • Atomic Changes: Each commit represents a discrete, self-contained change, making it easier to revert specific changes if needed.
    • Reduced Noise: Pushing frequently can clutter the commit history with minor or incomplete changes, which can be avoided with periodic pushes.
  • Considerations:
    • Avoid Pushing Broken Code: If you push only when your code is in a stable state, this approach can work well. Otherwise, you might introduce bugs to the shared repository.
    • Better for Collaboration: If multiple team members are working on the same branch, making several commits before pushing can reduce conflicts and simplify the review process.

2. Pushing Each Commit Immediately:

  • Advantages:
    • Real-Time Collaboration: Other team members can see and potentially build upon your latest changes immediately.
    • Continuous Integration: Pushing frequently can trigger automated tests or deployment pipelines, allowing you to catch issues early.
    • Incremental Sharing: If your commits are small and well-tested, pushing immediately can help you share your progress incrementally.
  • Considerations:
    • Messy History: Frequent, small commits can lead to a cluttered commit history, making it harder to follow the logical progression of changes.
    • Rollback Complications: If you realize you need to revert a specific feature or change, it might be more complicated to isolate and revert individual commits.

In practice, developers often strike a balance between the two approaches. They make smaller, meaningful commits locally while working on a feature or bug fix, ensuring their changes are logically grouped. Once the feature or fix is complete, they perform a final review of the commits and possibly squash or rebase them into more coherent, atomic commits before pushing to GitHub. This approach combines the benefits of both methods and creates a clean, organized commit history while still maintaining real-time collaboration with the team.

Ultimately, the key is to communicate and align with your team on the preferred approach and follow any established guidelines or best practices for your project.

 

Create and use SSH key to login to your server

OK, this is one of those posts where I am mostly writing down what I did to remember it for next time and not one of those generic advices with all kinds of options. Hope it still helps you.

Generating SSH keys

Let say you want to connect to your hosting server with your computer (Windows) using SSH keys and not use password anymore. Passwords are annoying and less secure.

Open the Windows Terminal and type ssh-keygen

You will be prompted to specify the location and filename for the key pair. By default, it will be saved in the user’s home directory under `C:\Users\\.ssh\`. I just pressed enter.

Next, you’ll be prompted to enter and repeat a passphrase for the key. If you want you can create one but I just pressed enter twice to skip it. SSH key pair will now be generated: a private key (`id_rsa`) and a public key (`id_rsa.pub`).

You can now use the public key (`id_rsa.pub`) for authentication purposes with remote servers or services. The private key (`id_rsa`) should be kept secure and not shared with anyone.

Adding public SSH key to your hosting account via Cpanel

Login to you hosting account’s Cpanel and click on ‘SSH Access” then “Manage SSH Keys” and then “Import Key”.

Now you can go back to Windows and open that id_rsa.pub file and copy the content of it or you can type this in terminal (assuming the name of your public SSH key id_rsa.pub):
clip < C:\Users\\.ssh\id_rsa.pub

keep in mind you have to use path and name of file on your computer, not just copy paste the above.

Then go back to cpanel’s “Import SSH Key” page and give it a name (like My PC), input your passphrase (if you have one) into passphrase field and then paste the public key into field for public key. I left private key field empty. Click Save or Import.

You will be taken to Public Keys page. If your key is NOT authorized then click Manage next to your key and click Authorize and save.

Connect to server via terminal

In your server’s Cpanel you should find username, IP and maybe port. Then you type:’

ssh username@SERVER-IP:port

hit enter and you should connect to server without the need for password.

Should I create Git repository in public_html or different folder?

It is generally not recommended to create a Git repository directly inside the `public_html` folder of your web server. The `public_html` (or `public` or `www`) directory is typically the web server’s root directory, and its contents are accessible to the public through the internet. Placing your Git repository there could expose sensitive information and potentially compromise your code’s security.

Instead, it is a good practice to keep your Git repository outside the `public_html` folder and use a deployment strategy to publish your code to the web server.

Here’s a common directory structure:

In this setup, the `public_html` folder contains only the files necessary to serve your website to the public. Your actual code resides in the `git_repository` folder, which is not accessible to the public.

When you’re ready to deploy a new version of your website, you can use various methods to transfer the relevant files from the Git repository to the `public_html` folder. Some common deployment strategies include:

1. Git pull (or clone) on the server: SSH into your server, navigate to the `git_repository` folder, and pull the latest changes from your remote repository. Then, copy the required files to the `public_html` folder.

2. Deploy script: Write a script that automates the deployment process. The script can pull the latest changes from the Git repository and copy the necessary files to the `public_html` folder.

3. CI/CD tools: Use continuous integration and continuous deployment (CI/CD) tools like Jenkins, Travis CI, or GitHub Actions to automate the deployment process whenever you push changes to your Git repository.

Using one of these deployment strategies will help keep your sensitive code and configuration files secure, while still allowing you to publish your website to the public_html directory for the world to access.

Disable new Windows context menu

I am not really a fan of new windows (10,11) context menu because it somehow always seems that things I need require an additional click. It is quite annoying to have to click on “Show more options”:

windows 11 context menu

In my previous post, I taught you How to add “Open Cmder Here” in context menu on Windows. Of course it is not in new context menu, it is in the “old’ one which needs another click on the “Show more options” menu option.

Somehow Windows doesnt allow us to revert back to old menu or even add menu items. There are many step by step tutorials on net on how to do it manualy in registry but here is the easiest one I found. One command for disabling this new context menu and one for enabling it back.

Paste this code into a command prompt (cmd) or press Windows key + R and past it there

Disable new context menu

reg.exe add "HKCU\Software\Classes\CLSID\{86ca1aa0-34aa-4e8b-a509-50c905bae2a2}\InprocServer32" /f /ve

You will need to restart Explorer shell to take effect in both cases – or just restart Windows.

Restore new context menu

reg.exe delete "HKCU\Software\Classes\CLSID\{86ca1aa0-34aa-4e8b-a509-50c905bae2a2}" /f 

Now the easiest way to restart Explorer shell is to press Ctrl+Shift+Esc to open the Task Manager, then right-click Windows Explorer and select “Restart” to restart it.
restart explorer
Another alternative is to simply restart Windows.

How to add “Open Cmder Here” in context menu on Windows

Cmder is a powerful command-line interface (CLI) tool for Windows operating systems that aims to enhance the overall command line experience. It provides a comprehensive collection of Unix-like commands, as well as a customizable console emulator that supports multiple tabs and a streamlined user interface.

If you want to add Open Cmder Here in context menu on Windows in a chosen folder then this is what you need to do:

  1. Open a terminal as an Administrator. It can be cmder or Windows cmd, it doesn’t matter.
  2. Navigate to the folder you have placed Cmder. (where you keep cmder.exe file)
  3. Run this command : .\cmder.exe /REGISTER ALL

If you get an “Access Denied” message, make sure you are executing the command in an Administrator prompt.

In a file explorer window right click in or on a directory to see “Cmder Here” in the context menu. If you are on Windows 10 or 11 you probably wont see it immediately. You have to click “Show more options” first and then you will see it there.

Fix the “It looks like this is a premium phone number” OpenAI ChatGPT problem

I bought a new mobile phone number to finally test the ChatGPT and imagine my disappointment when I inputted my phone number at ChatGPT registration page and I received this error:

It looks like this is a premium phone number. Please provide a valid, non-premium phone number to continue

The number is new and for some reason they believing it poses a risk. This is what they say about “Premium numbers” on their FAQ page:

Premium numbers are often associated with higher instances of fraud or abuse. Blocking these numbers helps us ensure platform integrity and reduce fraud and abuse

After Googling for a while, it was obvious that lots of people have the same problem. There might be more solutions to this problem – I will update the page as I encounter them – but this is what worked for me:

Add 00 in front of your number (right after country code).

So let say you are from Norway, so your country code is +47 and your (made up for this example) mobile number is 012 XXX XXX and you get premium number error on ChatGP registration page then you need to write it like this :

+47 00 12 XXX XXX

As you can see, we added 00 (two zeroes) after country code and before actual number (note: we omit the leading 0 from 012, so there will not be 3 zeroes. This is normal when calling with country code).  I tried this trick and I was successfully sent confirmation code.

CTRL+C doesn’t work in Edge, unless you press it multiple times

I try to give MS Edge a chance, but it has weird quirks. One of them seems to be that CTRL+C (copy text) barely works in Edge! You select a text, press CTRL+C, then paste it and there is no text pasted, or the old text that was in the clipboard gets pasted instead! If you press CTRL+C several times (or press the right mouse button and select copy from the menu), then it works. What is going on here? It is 2023 and Edge still has this problem. It was becoming so annoying that I thought to myself, I can’t be the only one with this problem. And (luckily) I am not.

Well, the problem seems to be the mini menu that pops up near cursor when you select a text that is then preventing CTRL+L to work.

Here is how to turn it off and fix the Edge copy paste problem:

Click 3 small dots in the top right corner of Edge, select Settings, then Appearance and scroll down to Context menus.

Mini menu on text selection Edge copy paste problem

Find “Mini menu on text selection” and disable “Show mini menu when selecting text“. This should fix the Edge copy paste problem. Happy copy pasting with Edge.

Fatal error: Unparenthesized `a ? b : c ? d : e` is not supported in DatabaseInterface.php on line 615

You will get this error when you upgrade your PHP 7 to PHP 8 (or even 7.3 to 7.4 or something like that) but keep your old phpmyadmin version. This error can be in any code but in our case it is in phpMyAdmin\libraries\classes\DatabaseInterface.php file so we need to fix it for phpMyAdmin. We will not fix the code itself because in this case it is not needed.

The solution here is for Laragon. It is a little longer, but easy, Laragon oriented solution so you can better understand how it works. Scroll down to the end to do this manually (faster).

Laragon solution

It is possible that your Laragon came with older phpMyAdmin version. So we will tell Laragon to download the latest one.

Open your {INSTALLATION_PATH}\laragon\etc\apps\phpMyAdmin folder. Just in case, backup this phpMyAdmin folder first. Then delete all files in it so the folder is empty.

Right click the laragon tray icon, then Tools then Quick add and then Configuration…

laragon options configuration quick app

this will open packages. conf file in your text editor. Find this line :

# phpMyAdmin
phpmyadmin= *******

of course you will see a link to phpmyadmin download page. It will pobably be link to a specific version.

Change it to this (latest version of phpmyadmin) and save the file.

# phpMyAdmin
phpmyadmin=https://www.phpmyadmin.net/downloads/phpMyAdmin-latest-all-languages.zip

Note: if the second line starts with # you need to delete the # character.

Right click the laragon tray icon again, then Tools then Quick add and then phpmyadmin… and Laragon with automatixally downlaod the latest phpMyAdmin and install it.

laragon phpmyadmin

Restart Laragon, open yourproject.test/phpmyadmin/ in your browser (your project will be called different than yourproject.test) and phpmyadmin should work.

Manual solution

1. backup and then delete all files in {INSTALLATION_PATH}\laragon\etc\apps\phpMyAdmin folder
2. Download the latest version of phpMyAdmin from https://www.phpmyadmin.net/downloads/
3. Extract the content of downloaded ZIP file into a empty phpMyAdmin folder
4. Restart laragon and phpMyAdmin should work.

Disable Google Lens search in Chrome

this will be a short one but it is quite annoying one: Google Chrome keeps making Lens as default image search in Chrome after every few updates (not often). It is used when you right click an image on internet and select “Search image with Google”. Here is how to turn lens off:

Open a new tab and go to chrome://flags.

Search and locate the following flag: Enable Lens features in Chrome. From the drop-down, select Disabled

You need to relaunch Chrome and problem solved.