DEV Community: RedouaneSarouf

Python Magic Methods

RedouaneSarouf — Mon, 09 Oct 2023 00:08:27 +0000

In this post i will be demonstrating the use of some of python magic magic methods also known as "dunder" methods and how to implement them in your code.
Magic methods are special methods in Python that start and end with a double underscore, such as init, str, add, and many more. These methods have specific names and purposes, and they enable you to define how instances of your custom classes interact with Python's built-in functions and operators.
Lets explore some of these magic methods.

*1. The Constructure method init: *

It is used to initialize objects attributes.
coding example:

class MyClass:
def init(self, value):
self.value = value

obj = MyClass(42)`

2.The string method str:

the string method define string representation of an object.

class MyClass:
def init(self, value):
self.value = value
def str:
return f'{self.value}"
obj = MyClass(42)

3. Length method len:

This method allows you to get the length of an object of your class making them compatible function like len().

`
class MyList:
def init(self, items):
self.items = items

def __len__(self):
    return len(self.items)

my_list = MyList([1, 2, 3, 4, 5])
print(len(my_list)) # Output: 5

`
4. Equal method eq:

This method allows to customize equalities for objects comparison.

`class MyClass:
def init(self, x, y):
self.x = x
self.y = y

def __eq__(self, other):
    if isinstance(other, MyClass):
        return self.x == other.x and self.y == other.y

c1 = MyClass(5, 6)
c2 = MyClass(2, 3)
c3 = MyClass(5, 6)
print(c1==c2) # False
print(c1==c3) # True`

In Conclusion Python magic methods are the very powerful tool you can use to customize your classes and making them more flexible. They enable you to define how objects behave in various contexts, from initialization to string representation, arithmetic operations, and more. Magic methods empower you to write clean, readable, and powerful Python code, elevating your programming skills to the next level.

Python Bitwise Operators Explained in Detail

RedouaneSarouf — Mon, 28 Aug 2023 03:05:26 +0000

This post explains python bitwise in detail with easy to understand code example. Python provides several bitwise operators that allow you to work directly with the binary representations of integers.
We'll explore the world of Python bitwise operators and their functionality.

Understanding Bitwise Operators with code example:

Bitwise operators work on individual bits of integers, treating them as binary values (0s and 1s). Python provides the following bitwise operators:

Bitwise AND (&):
The & means both bits have to be on

    int1 = 10     # 00001010 in binary
                  # 00008020
    int2 = 6      # 00000110 in binary
                  # 00000420

    # int1        = 00001010 = 10
    # int2        = 00000110 = 6
    # int1 & int2 = 00000010 = 2

    print(10 & 6) # Output: 2 (00000010 in binary)

Bitwise OR (|):
The (|) means at least 1 bit has to be on or both.

    8bits(256 128 64 32 16 8 4 2 1)
    int1 = 10     # 00001010 in binary
                  # 00008020
    int2 = 6      # 00000110 in binary
                  # 00000420

    # int1        = 00000100 = 4
    # int2        = 00001000 = 8
    # int1 | int2 = 00001100 = 12

    print(4 & 8) # Output: 12 (00001100 in binary)

Bitwise XOR (^):
The ^ means both bits have to be different either (1 0) or (0 1)
8bits(256 128 64 32 16 8 4 2 1)

    int1 = 10     # 00001010 in binary
                  # 00008020
    int2 = 6      # 00000110 in binary
                  # 00000420
    # int1        = 00000100 = 4
    # int2        = 00001000 = 8
    # int1 ^ int2 = 00001100 = 12

    print(4 & 8) # Output: 12 (00001100 in binary)

Bitwise NOT (~): Flips the bits of an integer. It changes all 0s to 1s and all 1s to 0s.

    n = ~10  #  0000 1010
              #  1111 0101        
    # the most significant bit is reserved for sign bit 
    # in this case the result will be negative 
    print(n)  # Output: -11 (Negative of (1010 + 1))

Bitwise Left Shift (<<): Shifts the bits of the left operand to the left by a specified number of positions. This is equivalent to multiplying the number by 2 raised to the power of the shift count.

    5 << 2   
    # binary representation for 5 is 0000 0101
    # number 2 means shifting by 2 bits
    # << 2 means we shift 2 bits to the left 
    # 0001 0100
    print(5 >> 2)  # Output: 2 (0001 0100 in binary)

Bitwise Right Shift (>>): Shifts the bits of the left operand to the right by a specified number of positions. This is equivalent to dividing the number by 2 raised to the power of the shift count, while discarding the remainder.
```
    5 >> 2   
    # binary representation for 5 is 0000 0101
    # number 2 means shifting by 2 bits
    # >> 2 means we shift 2 bits to the right 
    # 0000 0001
    print(5 >> 2)  # Output: 2 (0000 0001 in binary)
```

React CORS

RedouaneSarouf — Sun, 02 Jul 2023 20:05:58 +0000

Introduction:
Cross-Origin Resource Sharing (CORS) is an essential security mechanism that allows web applications to access resources from different domains. As a React developer, it is crucial to have a solid understanding of CORS and how it can affect your application's functionality. In this blog post, we will explore what CORS is, how it works, and how to handle CORS-related issues in your React application.

What is CORS?
CORS is a browser-based mechanism that enables controlled access to resources located on a different domain. It is implemented as a set of HTTP headers exchanged between the client (browser) and the server. These headers determine whether a request from a particular origin (domain) should be allowed or denied access to server resources.

How CORS Works:
When a client makes a cross-origin request, the browser sends an HTTP OPTIONS preflight request to the server, asking for permission to make the actual request. The server responds with the appropriate CORS headers, indicating whether the request is allowed. If the server approves the request, the browser proceeds with the actual request. Otherwise, it blocks the request, preventing the client from accessing the server resources.

Handling CORS in React:
1. Enabling CORS on the Server:
To allow cross-origin requests, the server must be configured to send the appropriate CORS headers. This can be done by adding specific response headers, such as Access-Control-Allow-Origin, Access-Control-Allow-Methods, and Access-Control-Allow-Headers, to the server's HTTP responses. Consult your server's documentation to find out how to enable CORS.

2. CORS in Development Environment:
During development, React applications typically run on a different port than the server's API. To avoid CORS issues, you can utilize a proxy server or a package like http-proxy-middleware to proxy API requests from the client-side to the server-side. This way, the requests appear to be originating from the same origin, bypassing CORS restrictions.

3. Using Fetch or Axios:
When making API requests in React, it is common to use libraries like Fetch or Axios. These libraries automatically handle CORS-related headers and options for you, making it easier to interact with APIs that are on different domains. However, it is still important to ensure that the server's CORS configuration allows the specific request methods and headers required by your application.

4 CORS Error Handling:
If your React application encounters a CORS error, it is crucial to handle it gracefully. You can display an error message to the user or redirect them to a fallback page. Additionally, you can implement error logging to capture CORS-related issues and track them for future troubleshooting.

Conclusion:
Understanding CORS is essential for React developers, as it allows for secure communication between web applications and different domains. By properly configuring the server, handling CORS in the development environment, and utilizing appropriate libraries, you can ensure that your React application works seamlessly with cross-origin resources. Remember to handle CORS errors gracefully to provide a better user experience.

JavaScript var keyword usage

RedouaneSarouf — Sun, 14 May 2023 19:18:11 +0000

JavaScript var keyword: Usage and Best Practices
In JavaScript, variables are used to store data values. The 'var' keyword is used declare a variables of any type without initializing them and it stands for variable.
here is an example of declaring a variable using 'var':
var [variable name];
In this blog post we will discuss the usage and how it differs from other type of variable declaration.
Difference between var, let and const. let is used in situation where you may want to reassign the variable again.

let dog = "Bella";
dog = "Tracy" //reassigning the dog value

const is used to declare variables that can not be changed once declared similar to final keyword in java language.

const cat = "Brent";
cat = "jay"// error;

Both keywords let and const can not escape block scope. On the other hand, 'var' can escape block scope but can not escape function block.
here is an example of var escaping:

for(var i = 0; i < 4; i++){
console.log(i);// 0 1 2 3
}
console.log(i) // the value of i is 4;

Best practices is to avoid creating global variables and use let and const instead of var. var can cause issues with naming conflict and make your code difficult to read.