SQL Injection Attacks # Intro

Welcome to this journey of understanding the concept of this famous vulnerability SQL Injection, we’ll try together to understand the basics and we’ll go step by step exploring it.

What’s a Web Application

Before going further, let’s first describe what’s a web application? A web application is an application that is accessed from a web browser, where the web browser will be the responsible for rendering the result coming from a web server.

Let’s take a simple example of this blog running under a Wordpress CMS, you’re reading this article from a web browser (Google Chrome, Firefox, Internet Explorer…) installed on your computer, the article is stored somewhere on a database server plus an HTTP Server rendering a server-side scripting language.

What I describe here is the combined parts that form a web app, the first part is the presentation of the result (a Web browser), the logic part (a server-side programming language in this case PHP), and in the end the database or the storage part (MySQL, SQL, Oracle…).

Read More

How to access to the graphcool database using CLI or PhpMyAdmin

I’ve an already mounted containers using the name of users-permissions, and this is the list of the containers:

04db65cb9ba7        graphcool/graphcool-dev:0.11.1   "/app/bin/single-ser…"   2 hours ago         Up 2 hours          0.0.0.0:60000->60000/tcp         users_permissions_graphcool_1
bab62d6ed0ec        mysql:5.7                        "docker-entrypoint.s…"   2 hours ago         Up 2 hours          3306/tcp, 33060/tcp              users_permissions_graphcool-db_1
f26d74765251        graphcool/localfaas:0.11.1       "/app/bin/localfaas"     2 hours ago         Up 2 hours          0.0.0.0:60050->60050/tcp         users_permissions_localfaas_1

As you already see the container that hold our database is using the name users_permissions_graphcool-db_1, this container is create from an mysql:5.7 server, and I’ve two solutions to access to it, one uses CLI and a second one uses Phpmyadmin.

Read More

Disallow prettier to format certain files

I’m using prettier with an auto format when I save any file, however, I want to disallow prettier completely on certain files, to do so I create a .prettierignore file on the root of my project and I add the file I want to ignore.

Pass optional function parameter in Typescript

You can use undefined for the non defined parameter:


function addNumbers(a: string, b: string, message: string) {
   return `${message} ${a + b}`;
}

const result = addNumbers(10, 17, undefined)
// result = 27

Because I set the message parameter to undefined the result will be in this case27.
You can also use the question mark close to the parametermessage?:string without using the undefined value when you use the function.


function addNumbers(a: string, b: string, message?: string) {
   return `${message} ${a + b}`;
}

const result = addNumbers(10, 17)
// result = 27

Use bcrypt to campare passwords using nodejs

Storing your password as a plain text is fast, however it is not secure, this why you have to make it complicated for hackers to get important information by using hashing, there is a couple of hashing functions like md5, we’ll not use md5 which it is not designed for passwords plus it’s cryptographically broken when the attacker can generate a list of common password and their corresponding hashes, then comparing the hashes to the site has stored.

You’ll use bcrypt which it is more designed for passwords, bcrypt use a salt to make a hash output unique even if your users use the same password, and this is a simple use case of bcrypt for a user who wanna update his password.

const bcrypt = require("bcryptjs");

// Generate Salt
const salt = bcrypt.genSaltSync(10);

// Plain Text Passwords
const currentpPassword = "abc123";
const oldPassword = "abc123";
const newPassword = "nWd6yCyj";

// Generate the Current User Password Hash
// by combining the salt and the password
const currentPasswordHash = bcrypt.hashSync(currentpPassword, salt);

// Compare the Old Password set by the user
// to the Current Password Hash
if (!bcrypt.compareSync(oldPassword, currentPasswordHash)) {
  console.log("The Current Password is Wrong");
}

// The new password should not be similar
// to the old password
if (bcrypt.compareSync(newPassword, currentPasswordHash)) {
  console.log(
    "The new password is similar to the new password, please choose a different one",
  );
}

Solve the Cannot read property hash of undefined error

After I update the next.js from the version 6.1.2 to the newest version at the time 7.0 I run yarn build to do the compilation and this is what I had as an errors:

[hardsource:efb84745] Could not freeze ./lib/queries.js: Cannot read property 'hash' of undefined
[hardsource:efb84745] Could not freeze ./pages/signin.js + 1 modules: Cannot read property 'hash' of undefined
[hardsource:efb84745] Could not freeze ./pages/create-account.js + 2 modules: Cannot read property 'hash' of undefined
[hardsource:efb84745] Could not freeze ./pages/activate-account.js + 1 modules: Cannot read property 'hash' of undefined
[hardsource:efb84745] Could not freeze ./pages/reset-password.js + 1 modules: Cannot read property 'hash' of undefined
[hardsource:efb84745] Could not freeze ./pages/reset-password-confirmation.js + 1 modules: Cannot read property 'hash' of undefined

To solve this problem I remove the hard-source folder from /node_modules/.cache/hard-source/ and I rerun yarn build again.

yarn build
yarn run v1.9.4
$ next build
[hardsource:8c7e1fbc] Using 7 MB of disk space.
[hardsource:8c7e1fbc] Tracking node dependencies with: package-lock.json, yarn.lock.
[hardsource:8c7e1fbc] Reading from cache 8c7e1fbc...
[hardsource:efb84745] Using 7 MB of disk space.
[11:57:22 AM] Compiling client
[hardsource:efb84745] Tracking node dependencies with: package-lock.json, yarn.lock.
[hardsource:efb84745] Reading from cache efb84745...
[11:57:49 AM] Compiling server
[11:57:50 AM] Compiled client in 28s
[11:57:50 AM] Compiled server in 662ms
✨  Done in 34.11s.

Capitalise the first letter of each word using javascript

As an Example you’ve a full name john doe that you want it to be converted to John Doe when each first letter of the full name has to be in uppercase, to achieve that you’ll create a function that analyse a string entry and use regular expression to convert first letter to the uppercase form:

const capitalize = str => {
  const lower = String(str).toLowerCase();
  return lower.replace(/(^| )(\w)/g, function(x) {
    return x.toUpperCase();
  });
};

And this is the output of using the function capitalize("john doe"):

John Doe

Use the ES6 import on node

If you decide to use the ES6 import instead of require, this is a simple presentation on how to achieve that using babel:

– First Install the core dependencies:

npm install babel-register babel-preset-env --save-dev

– Create a starter.js file that contain how your code has to be transpiled plus the file that contains your imports:

require("babel-register")({
  presets: ["env"],
});

// Import the rest of our application.
module.exports = require("./test.js");

And to now your can use import on your test.js file instead of require:

import validator from "validator";

const email = "yep";

if (!validator.isEmail(email)) {
  console.log("the email is not valid");
}

To test the output:

node starters.js

CSS FlexBox Warm Up

You’ve got a list of element, and you want them to be listed correctly in a container, an old-school solution is to use float or display. However, these two CSS properties don’t give you total control of how you can stretch these elements inside a container.

In this article, you’ll discover how to control a list of items inside of a container using flexbox, and this’s a demo of what you want to achieve:

See the Pen FlexBox Sandbox by Arbaoui Mehdi (@arbaoui_mehdi) on CodePen.


Read More

1337 School, The new Born Pair Programming School

After watching a video of a new born “Pair Programming” Bootcamp, School or whatever you call it, this what I’m thinking about it:

Pair programming is a super cool concept that allows people to learn faster, however, programming is not just about writing code, these are some core computer science concepts that have to be included to have a strong profile, what about Data structures?!, what about Algorithms?!, and what About a big O notation?!

Read More