Month: May 2021

Git commands on production server & Git issues

The following commands can be used on a production server.
In the case of a local machine development, use free software like GIT DESKTOP / SourceTree

First deployment in a folder

git clone <URL GITLAB/GITHUB HTTPS>

Updating / Getting last changes

git pull

The following commands respond to particular problems that may arise.

Changing the URL of a GIT Repository

This problem can occur if you are using GITLAB or GITHUB with SSH and you want to switch to HTTPS or vice versa, or following problems with the rights of an SSH key such as “remote: The project you were looking for could not be found.” and “fatal: Could not read from remote repository.”

Checking the repository URL:

git remote -v

Changing the URL of the repository:

git remote set-url origin <URL>

You cannot pull the changes “You have unstaged changes”

You may get the following error, indicating that some files have changed and need to be committed when you haven’t touched anything and just want to update the server:

Cannot pull with rebase: You have unstaged changes. 
Please commit or stash them. 

In order the solve this problem we should remove all the unstaged changes:

git reset --hard

You can now use the git pull command.

Back to the previous commit

git reset --hard HEAD^

Back to a specific commit

git reset --hard <ID COMMIT>

The commit ID is usually 7 digits and hexadecimal letters, example:
26b47fa

You can find it in the history tab of your GIT DESKTOP

Deleting a Commit in the Middle of the History

The two previous commands can delete commits but they are removing from the begining (the most recents commits). It is possible that we want for example to keep the most recent commit and delete a commit in the middle of the history. Replace “sha1-commit-hash” with the ID of the commit BEFORE the first commit you want to delete. For example, if you want to delete the 2nd, 3rd commit in a chronological order, then put the ID of the 4th commit, in a way to see the 3 commits in the editor.

git rebase -i <sha1-commit-hash>

This will open the editor. On the line of the commit you want to remove, change the text “pick” to “drop“.

drop ab12345678 feat: feature to delete # empty
pick cd12345678 feat: important feature

# Rebase ab12345678..cd12345678 onto ef12345678 (2 commands)
#
# Commands:
# p, pick <commit> = use commit
# r, reword <commit> = use commit, but edit the commit message
# e, edit <commit> = use commit, but stop for amending
# s, squash <commit> = use commit, but meld into previous commit
# f, fixup [-C | -c] <commit> = like "squash" but keep only the previous
#                    commit's log message, unless -C is used, in which case
#                    keep only this commit's message; -c is same as -C but
#                    opens the editor
# x, exec <command> = run command (the rest of the line) using shell
# b, break = stop here (continue rebase later with 'git rebase --continue')
# d, drop <commit> = remove commit
:x!

Use :x! to save your modifications and then check it in Git Desktop history or git log command.

Tips: if you have several commits to delete, you can use 2,$s/pick/drop/c to replace (it will ask if you want to replace with “Y” yes or “N” no)

Then you can git push –force to push it on the remote repository.


Overwrite changes on the distant repository (local > remote)

git push --force origin master

Caution, delete on the distant repository, useful if you want to “delete” a commit that has been pushed.

Overwrite changes on the local repository (remote > local)

git reset --hard origin/master

Caution, deletes all the changes made not pushed to the remote git, useful if you want to “delete” the commits locally to have the same thing as on the remote git.

OnClick inside OnClick with React

While doing some test after putting the event OnClick in a DIV inside another DIV with the Onclick event, I was not able to trigger the OnClick event that was inside the other.

<div id="div1" style={{background: 'red'}} onClick={() => { 
setClicked('div1');
}>
  DIV 1
  <div id="div2" style={{background: 'green'}} onClick={() => { 
  console.log('you clicked div2');
  setClicked('div2');
  }>
    DIV 2
  </div>
</div>
When we click on the DIV 2, it triggers the DIV 1 onClick event

If you click on the green div, and then, if you check the logs you see that the log is working, you triggered the event.
But, if you check your state, you will see that it’s div1, and not div2, but you clicked DIV 2.
Your click action has been propagate to the DIV 2.

How to solve the problem

In order to solve this problem, we will need a fix. So we can trigger both events.
The problem is that the click action is propagate to the the other div.
So, we need to check when you trigger the onClick action that the user clicked on the good one.
To do so, we can add the following instructions in the inner DIV:

if(event.target !== event.currentTarget) return;

Which will give:

<div id="div1" style={{background: 'red'}} onClick={(event) => { 
if(event.target !== event.currentTarget) return;
setClicked('div1');
}>
  DIV 1
  <div id="div2" style={{background: 'green'}} onClick={() => { 
  console.log('you clicked div2');
  setClicked('div2');
  }>
    DIV 2
  </div>
</div>

With buttons inside a DIV with 3 levels DIV

If you have 3 levels of DIV and you want only the action of the button of the div the be triggered then you can use the following instruction in the end of the OnClick:

<div id="div3" style={{background: 'yellow'}} onClick={(event)=>{
...
event.stopPropagation();
}}/>

stopPropagation will stop the click event and so the second OnClick event will not be triggered.

Detect languages with PHP

If you have a standard website with CMS such Drupal, WordPress, phpBB… You may want to detect language in some pages.
To do so, you can use the following PHP function :

$_SERVER['HTTP_ACCEPT_LANGUAGE']

You should create an array of all the accepted languages, for example let’s say it’s French, English, Portuguese and Russian :

$acceptLang = ['fr', 'en', 'pt', 'ru'];

Then, you can set a default language, usually English the universal language, and detect if it’s in the array. Which will give:

$lang = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2);
$acceptLang = ['fr', 'en', 'pt', 'ru'];
$lang = in_array($lang, $acceptLang) ? $lang : 'en';

Finally, in your code, you can use the value of the $lang variable to change the value of your text according the the selected language.

Inline function javascript to put cookies without JQuery

If you are using basic pages such landing pages, is it possible that you still use basic languages such HTML/CSS/Javascript.
Here is an example of putting cookies and a log of the cookies with an inline function:

<a style="cursor: pointer;" onclick='(function() {
  document.cookie = "cookie=value"; 
  console.log( "cookies:", document.cookie ); 
})()'>
  Click Me 
</a>

Because we are not using href but onlick, I added the cursor style of pointer so the user can know he can click.

Install MariaDB on a Fedora/CentOS/RedHat server

If you have your own server, the first thing you may want to do with your backend shoud be to install a database server on it.

Here is step by step how to install a MySQL/MariaDB (almost the same) database on your server:
Install the MariaDB service:

yum install mariadb mariadb-server

Create your user access – change the username and password you want:

mysql
CREATE USER username@'%' IDENTIFIED BY 'password';
GRANT ALL PRIVILEGES ON *.* TO 'username'@'%' ;
flush privileges;

Verify the user has been created:

SELECT User FROM mysql.user;

You should be able to login on your database from you app and remotely.