DEV Community: almokhtar bekkour

create a modal component with stimulus js

almokhtar bekkour — Sun, 11 Dec 2022 15:21:26 +0000

Here is an example of how you could create a modal component with Stimulus.js:

// controllers/modal_controller.js
import { Controller } from "stimulus"

export default class extends Controller {
static targets = ["overlay", "content", "closeButton"]

open() {
this.overlayTarget.classList.add("is-active")
this.contentTarget.classList.add("is-active")
}

close() {
this.overlayTarget.classList.remove("is-active")
this.contentTarget.classList.remove("is-active")
}

toggle() {
this.overlayTarget.classList.toggle("is-active")
this.contentTarget.classList.toggle("is-active")
}

// Event handler for the "click" event on the close button
closeButtonClick(event) {
event.preventDefault()
this.close()
}
}

This modal component uses a few classes to control its visibility:

is-active: shows the modal
is-inactive: hides the modal

To use this component in your HTML, you would need to add the following markup:

<a href="#">Close</a>

This will create a modal with an overlay, a content area, and a close button. When the close button is clicked, it will call the closeButtonClick method on the modal controller, which will hide the modal.

Merge Two Binary Trees by doing Node Sum (Recursive and Iterative) javascript

almokhtar bekkour — Sun, 11 Dec 2022 14:42:53 +0000

To merge two binary trees by doing a node sum, you can use either a recursive or an iterative approach. Here is how you could implement this using each approach in JavaScript:

Recursive approach

Create a function that takes two binary trees as arguments and returns their merged tree.

In the function, check if one of the trees is null. If so, return the other tree.

If both trees are non-null, create a new node with the value equal to the sum of the values of the two nodes.
Set the left child of the new node to the result of merging the left children of the two nodes.

Set the right child of the new node to the result of merging the right children of the two nodes.

Return the new node.

Here is an example of what the main parts of your solution might look like:

class Node {
  constructor(value) {
    this.value = value
    this.left = null
    this.right = null
  }
}

function mergeTrees(t1, t2) {
  if (t1 == null) return t2
  if (t2 == null) return t1

  const node = new Node(t1.value + t2.value)
  node.left = mergeTrees(t1.left, t2.left)
  node.right = mergeTrees(t1.right, t2.right)

  return node
}

const t1 = ...
const t2 = ...
const mergedTree = mergeTrees(t1, t2)

// display the merged tree

Modify a binary tree to get Preorder traversal using right pointers only

almokhtar bekkour — Sun, 11 Dec 2022 14:38:29 +0000

To modify a binary tree to perform a preorder traversal using only the right pointers, you will need to make some changes to the tree structure and the traversal algorithm. Here is one way you could approach this problem:

In the binary tree, add a new pointer to each node that points to the node's rightmost descendant (or null if the node has no right descendants). This pointer will be used during the traversal instead of the node's right pointer.

Write a function to perform the preorder traversal. This function should start at the root node and visit the nodes in the following order: the root, the root's left child, the root's left child's left child, etc. until it reaches a leaf node.

At each step of the traversal, the function should use the new rightmost descendant pointer to move to the next node in the traversal. If the current node has no rightmost descendant, the function should backtrack to the nearest ancestor that has a rightmost descendant and move to that descendant.

The traversal should continue until it has visited all of the nodes in the tree.

Here is an example of what the main parts of your solution might look like:


class Node {
  constructor(value) {
    this.value = value
    this.left = null
    this.right = null
    this.rightmost = null // new pointer to rightmost descendant
  }
}

class BinaryTree {
  // initialize the tree and set the root node

  traversePreorder() {
    // perform a preorder traversal using only the rightmost pointers

    // return the list of nodes visited in preorder
  }
}

const tree = new BinaryTree(...)
const preorder = tree.traversePreorder()

// display the preorder traversal

You may need to modify the tree structure and the traversal algorithm depending on the specific requirements of your problem.

8 ruby metaprogramming examples

almokhtar bekkour — Sun, 11 Dec 2022 14:11:07 +0000

Metaprogramming is a powerful technique in the Ruby programming language that allows developers to write code that can manipulate or generate other code at runtime. Here are ten examples of metaprogramming in Ruby:

Defining methods dynamically: Ruby allows developers to define methods on the fly using the define_method method. This can be useful for creating methods with similar behavior but different names, or for defining methods based on user input.

Using "method missing" to handle undefined methods: Ruby allows developers to define a special method named "method_missing" that is invoked whenever an undefined method is called. This can be used to provide a default behavior for undefined methods, or to implement functionality such as method overloading.

Using "constant missing" to handle undefined constants: Similar to method_missing, Ruby also allows developers to define a "constant_missing" method that is invoked whenever an undefined constant is accessed. This can be used to implement lazy loading or other advanced behavior.

Using "class_eval safe" to define methods on classes: Ruby's class_eval method allows developers to define methods on a class, but it can also be dangerous because it allows arbitrary code to be executed. The class_eval_safe method provides a safer alternative that allows developers to define methods without the risk of executing arbitrary code.

Using "instance_eval" to define methods on instances: The instance_eval method allows developers to define methods on a specific instance of an object, rather than on the object's class as a whole. This can be useful for creating methods that are specific to a particular instance, or for defining methods that use instance variables.

Using "define_singleton_method" to define methods on singleton classes: Ruby allows developers to define methods on the "singleton class" of an object, which is a special class that is associated with a specific instance of an object. This can be useful for creating methods that are specific to a particular instance, or for defining methods that use instance variables.

Using "eval" to execute code dynamically: The eval method allows developers to execute Ruby code that is defined as a string at runtime. This can be useful for implementing features such as a command-line interface or a scripting language within a Ruby application.

Using "send" to invoke methods dynamically: The send method allows developers to invoke a method on an object by name, rather than by statically calling the method. This can be useful for implementing functionality such as dynamic dispatch or method overloading.

Check if string is palindrome without String#reverse

almokhtar bekkour — Sat, 18 Sep 2021 13:15:44 +0000

def palindrome?(str)
  reversed_str = ''
  i = str.length - 1
  while i >= 0
    reversed_str += str[i]
    i -= 1
  end
  reversed_str == str
end

specs

describe "palindrome?" do
    it "should accept a string as an arg" do
      expect { palindrome?("tot") }.to_not raise_error
    end

    context "when the string is the same forwards and backwards" do
      it "should return true" do
        expect(palindrome?("tot")).to eq(true)
        expect(palindrome?("racecar")).to eq(true)
        expect(palindrome?("madam")).to eq(true)
        expect(palindrome?("aa")).to eq(true)
        expect(palindrome?("a")).to eq(true)
      end
    end

    context "when the string is not the same forwards and backwards" do
      it "should return false" do
        expect(palindrome?("cat")).to eq(false)
        expect(palindrome?("greek")).to eq(false)
        expect(palindrome?("xabcx")).to eq(false)
      end
    end

    it "should not use String#reverse" do
      expect_any_instance_of(String).to_not receive(:reverse)
      palindrome?("tot")
    end
end

Real Time Markdown Preview (35 lines of code)!!

almokhtar bekkour — Sat, 12 Sep 2020 12:04:08 +0000

As The title Said, just 35 lines of code i made a markdown real time preview with sinatra and jquery and Github markdown Gem, this is the source code as screenshots.

source code github

I just want to write code!

almokhtar bekkour — Sun, 06 Sep 2020 21:13:00 +0000

I used to be under the impression that the job of a software developers was just to write code. I know I’m not alone in having been guilty of thinking that way.

The fact is that a majority of our time in the software development field is spent dealing with people, not with computers.

If you want to be a good software developer, you have to learn to deal effectively with people(even if writing code is the part of your job you enjoy the most).

Source: click Here

Hidden Feature Rails

almokhtar bekkour — Mon, 24 Aug 2020 17:03:46 +0000

Often, we discover an edge case, or know we want to improve some aspect of our code, but don’t have the time or energy to get to it right now. Hopefully we document these notes somewhere, but even if we do document them, there are some problems.
If we use an external task manager, these tasks could get out of sync with the actual codebase. And unless you leave a file and line number, you might not remember where exactly the issue is.
You might leave comments in your code, but those will inevitably be forgotten and ignored.

Rails comes with a hidden feature to help with managing your list of to-dos. As you’re writing code, you can leave one of these three notes:

"#TODO: handle edge case where x happens"
"#FIXME: this breaks under x condition"
"#OPTIMIZE: this takes 5 database queries"

And then, running rake notes (or rn if you’re making use of the aliases in the Aliases for Common Rails Commands section) will enumerate every note you’ve left in your code:

While you still have to take the initiative to go back and refactor your code, this will at least give a quick overview of what’s left to be done in your application and where to find it.

Don’t like the default TODO, FIXME and OPTIMIZE? You can also enumerate custom annotations:

rake notes:custom ANNOTATION=NOTE