chore: add dictionary entries

src/components/islands/search.jsx

@@ -158,7 +158,7 @@ function SearchDialog() {
   };
 
   return (
-    <div className="fixed left-0 top-0 z-auto p-5 w-full h-full flex justify-center bg-gray-100/30">
+    <div className="fixed left-0 top-0 z-auto p-5 w-full h-screen flex justify-center bg-gray-100/30">
       {/* Blur */}
       <div onClick={() => $isSearchOpen.set(!isSearchOpen)}
         className="absolute w-full h-full left-0 top-0 z-50 backdrop-blur-sm"

src/content/dictionary/algorithm.mdx

@@ -0,0 +1,31 @@
+---
+layout: ../../layouts/word.astro
+title: 'Algorithm'
+---
+
+An algorithm is a step-by-step procedure or formula for solving a problem. In the context of computer science, algorithms are essential for writing efficient and effective computer programs. They help in organizing and processing data to produce the desired output. Here's a fuller explanation of an algorithm with a code example written in JavaScript:
+
+### Explanation:
+An algorithm to find the factorial of a number calculates the product of all positive integers up to the given number. For example, the factorial of 5 (written as 5!) is 5 * 4 * 3 * 2 * 1 = 120.
+
+### Code Example:
+```javascript
+function factorial(n) {
+    // Base case: If the number is 0 or 1, return 1
+    if (n === 0 || n === 1) {
+        return 1;
+    } else {
+        // Recursive case: Multiply the number by the factorial of (n-1)
+        return n * factorial(n - 1);
+    }
+}
+
+// Example usage
+console.log(factorial(5)); // Output: 120
+```
+
+In this code:
+- The `factorial` function takes a single argument `n`, which is the number whose factorial is to be calculated.
+- It uses recursion to calculate the factorial. If the number is 0 or 1, it returns 1 (base case). Otherwise, it multiplies the number by the factorial of `(n-1)` (recursive case) until it reaches the base case.
+
+This algorithm demonstrates the use of recursion to solve a mathematical problem. It showcases a fundamental concept in algorithm design and highlights the importance of breaking down a complex problem into simpler, manageable subproblems.

src/content/dictionary/big-data.mdx

@@ -0,0 +1,26 @@
+---
+layout: ../../layouts/word.astro
+title: 'Big Data'
+---
+**Big Data** refers to the massive volume of structured and unstructured data that inundates a business on a day-to-day basis. It's characterized by its velocity, volume, and variety, often referred to as the three Vs. Big Data can come from various sources such as social media, business transactions, sensors, and more. The challenge with Big Data is not only the sheer volume but also the complexity of processing and extracting valuable insights from it.
+
+### Characteristics of Big Data:
+1. **Volume**: Big Data involves large amounts of data. Traditional data processing tools may struggle to handle such massive volumes.
+2. **Velocity**: Data streams in at an unprecedented speed. For example, social media platforms generate data in real-time, requiring quick processing to extract meaningful insights.
+3. **Variety**: Data comes in different formats, including structured (e.g., databases), semi-structured (e.g., XML, JSON), and unstructured (e.g., text, images, videos). Managing these diverse data types poses a challenge.
+
+### Importance of Big Data:
+1. **Decision Making**: Big Data provides valuable insights that organizations can use to make informed decisions. For example, analyzing customer data can help in personalized marketing strategies.
+2. **Improved Efficiency**: By analyzing data, organizations can identify inefficiencies and streamline operations.
+3. **Innovation**: Big Data fuels innovation by identifying trends and patterns that can lead to the development of new products or services.
+
+### Challenges of Big Data:
+1. **Storage**: Storing large volumes of data requires scalable and cost-effective solutions.
+2. **Processing**: Processing Big Data requires powerful computational resources and efficient algorithms.
+3. **Privacy and Security**: Handling sensitive data raises concerns about privacy and security.
+
+### Technologies for Big Data:
+1. **Hadoop**: An open-source framework for distributed storage and processing of large datasets.
+2. **Spark**: A fast and general-purpose cluster computing system for Big Data processing.
+3. **NoSQL Databases**: Non-relational databases that can handle large volumes of unstructured data efficiently.
+4. **Machine Learning**: Algorithms and models used to analyze Big Data and extract valuable insights.

src/content/dictionary/css.mdx

@@ -0,0 +1,85 @@
+---
+layout: ../../layouts/word.astro
+title: 'CSS (Cascading Style Sheets)'
+---
+A style sheet language used for describing the presentation of a document written in HTML or XML. **Cascading Style Sheets (CSS)** is a stylesheet language used to describe the presentation of a document written in HTML or XML (including XML dialects such as SVG, MathML, etc.). It controls the layout, colors, fonts, and other visual aspects of a web page.
+
+### Basic Syntax:
+```css
+selector {
+  property: value;
+}
+```
+
+### Selectors:
+- **Element Selector**: Selects HTML elements by name.
+  ```css
+  p {
+    color: red;
+  }
+  ```
+
+- **Class Selector**: Selects elements with a specific class attribute.
+  ```css
+  .highlight {
+    background-color: yellow;
+  }
+  ```
+
+- **ID Selector**: Selects a single element with a specific id attribute.
+  ```css
+  #main-header {
+    font-size: 24px;
+  }
+  ```
+
+- **Descendant Selector**: Selects an element that is a descendant of another specified element.
+  ```css
+  article p {
+    line-height: 1.5;
+  }
+  ```
+
+### Box Model:
+- **Margin**: Space outside the border.
+- **Border**: Border around the padding and content.
+- **Padding**: Space between the content and the border.
+- **Content**: The actual content of the box.
+
+### Example:
+```css
+/* Styles for a simple box */
+.box {
+  width: 200px;
+  height: 200px;
+  background-color: #f0f0f0;
+  border: 1px solid #ccc;
+  padding: 20px;
+  margin: 20px;
+  text-align: center;
+}
+
+/* Styles for a class */
+.button {
+  display: inline-block;
+  padding: 10px 20px;
+  background-color: #007bff;
+  color: white;
+  text-decoration: none;
+  border-radius: 5px;
+}
+
+/* Styles for an ID */
+#header {
+  font-size: 24px;
+  font-weight: bold;
+  text-align: center;
+  color: #333;
+}
+```
+
+### Importance of CSS:
+- **Consistency**: Ensures a consistent look and feel across a website.
+- **Accessibility**: Helps make content more accessible to users with disabilities.
+- **Responsiveness**: Allows for the creation of responsive designs that adapt to different screen sizes.
+- **Maintainability**: Makes it easier to maintain and update styles across a website.

src/content/dictionary/devops.mdx

@@ -0,0 +1,29 @@
+---
+layout: ../../layouts/word.astro
+title: 'DevOps'
+---
+**DevOps** is a software development methodology that combines software development (Dev) with IT operations (Ops). It aims to shorten the software development life cycle and provide continuous delivery of high-quality software. DevOps focuses on collaboration, automation, and integration between developers and IT operations teams to improve the speed and quality of software delivery.
+
+### Key Principles of DevOps:
+
+1. **Collaboration**: DevOps encourages collaboration between development, operations, and other stakeholders to ensure that everyone is working towards the same goals.
+
+2. **Automation**: Automation is key in DevOps to streamline processes, reduce manual errors, and increase efficiency. This includes automating build, test, and deployment processes.
+
+3. **Continuous Integration and Continuous Deployment (CI/CD)**: CI/CD is a set of practices that automate the integration of code changes and the deployment of applications, ensuring that software is always in a deployable state.
+
+4. **Infrastructure as Code (IaC)**: IaC allows infrastructure to be managed and provisioned through code, making it easier to scale and manage infrastructure resources.
+
+5. **Monitoring and Logging**: DevOps emphasizes the importance of monitoring and logging to ensure the health and performance of applications and infrastructure, allowing for quick identification and resolution of issues.
+
+### Benefits of DevOps:
+
+1. **Faster Delivery**: DevOps practices enable faster delivery of features, updates, and fixes, reducing time-to-market.
+
+2. **Improved Collaboration**: By breaking down silos between teams, DevOps improves collaboration and communication, leading to better outcomes.
+
+3. **Increased Efficiency**: Automation and streamlined processes lead to increased efficiency, allowing teams to focus on delivering value.
+
+4. **Higher Quality**: Continuous testing and integration result in higher-quality software with fewer defects.
+
+5. **Improved Security**: DevOps practices include security at every stage, leading to more secure software.

src/content/dictionary/framework.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'Framework'
+---
+A software framework is a reusable, pre-written code or set of libraries that provides a foundation on which to build applications. Example: React is a JavaScript framework for building user interfaces.

src/content/dictionary/full-stack.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'Full Stack'
+---
+A term used to describe developers who are proficient in both frontend and backend development. Example: A full stack developer can work on all aspects of a web application, from the user interface to the database.

src/content/dictionary/git.mdx

@@ -0,0 +1,55 @@
+---
+layout: ../../layouts/word.astro
+title: 'Git'
+---
+**Git** is a distributed version control system used for tracking changes in source code during software development. It was created by Linus Torvalds in 2005 for managing the Linux kernel development. Git is widely used in both open-source and commercial software development projects due to its efficiency and powerful features.
+
+### Key Concepts of Git:
+
+1. **Repository**: A repository, or repo, is a collection of files and directories that make up a project, along with the version history of each file.
+
+2. **Commit**: A commit is a snapshot of changes to the repository at a specific point in time. It represents a single, atomic change to the repository.
+
+3. **Branch**: A branch is a parallel version of the repository that allows for independent development of features or fixes. Branches are used to work on new features without affecting the main codebase.
+
+4. **Merge**: Merging is the process of combining changes from one branch into another. It is used to incorporate the changes made in a branch back into the main codebase.
+
+5. **Pull Request**: A pull request, or PR, is a request to merge changes from one branch into another. It is typically used in a collaborative development environment to review and discuss code changes before merging.
+
+6. **Remote**: A remote is a copy of the repository that is stored on a server. It allows multiple developers to collaborate on the same project and keep their local repositories in sync with the remote repository.
+
+### Basic Git Workflow:
+
+1. **Clone**: Clone a repository from a remote server to create a local copy on your machine.
+   ```
+   git clone <repository-url>
+   ```
+
+2. **Add**: Add changes to the staging area to prepare them for commit.
+   ```
+   git add <file>
+   ```
+
+3. **Commit**: Commit changes to the repository with a descriptive message.
+   ```
+   git commit -m "Commit message"
+   ```
+
+4. **Push**: Push committed changes from your local repository to a remote repository.
+   ```
+   git push
+   ```
+
+5. **Pull**: Pull changes from a remote repository to update your local repository.
+   ```
+   git pull
+   ```
+
+6. **Branch**: Create, switch, and merge branches to work on different features or fixes.
+   ```
+   git branch <branch-name>
+   git checkout <branch-name>
+   git merge <branch-name>
+   ```
+
+Git provides a powerful set of tools for version control and collaboration in software development, enabling developers to work efficiently and effectively on projects of any size.

src/content/dictionary/ide.mdx

@@ -0,0 +1,33 @@
+---
+layout: ../../layouts/word.astro
+title: 'IDE (Integrated Development Environment)'
+---
+An Integrated Development Environment (IDE) is a software application that provides comprehensive facilities to computer programmers for software development. An IDE typically consists of a source code editor, build automation tools, and a debugger, all integrated into a single graphical user interface.
+
+### Key Components of an IDE:
+
+1. **Source Code Editor**: IDEs include a text editor with features like syntax highlighting, code completion, and code formatting to make writing code easier and more efficient.
+
+2. **Build Automation Tools**: IDEs often come with tools to automate the build process, such as compilers, build scripts, and integration with version control systems.
+
+3. **Debugger**: IDEs provide debugging tools that allow developers to step through their code, set breakpoints, and inspect variables to find and fix errors in their programs.
+
+4. **Project Management**: IDEs offer features for managing projects, organizing files, and handling dependencies, making it easier to navigate and work with large codebases.
+
+5. **Version Control Integration**: IDEs integrate with version control systems like Git, allowing developers to manage code changes, branches, and merges directly from the IDE.
+
+6. **Extensions and Plugins**: IDEs often support extensions and plugins that can be used to add additional functionality, such as support for new programming languages or frameworks.
+
+### Advantages of Using an IDE:
+
+1. **Increased Productivity**: IDEs provide tools and features that streamline the development process, allowing developers to write code faster and more efficiently.
+
+2. **Code Quality**: IDEs often include tools for code analysis, refactoring, and testing, helping developers write cleaner, more maintainable code.
+
+3. **Consistency**: IDEs enforce coding standards and best practices, ensuring that code written by different developers follows the same conventions.
+
+4. **Debugging**: IDEs offer powerful debugging tools that make it easier to find and fix bugs in code.
+
+5. **Integration**: IDEs integrate with other development tools and services, such as build systems, version control, and issue trackers, providing a seamless development experience.
+
+6. **Community and Support**: IDEs often have large communities of developers and extensive documentation, making it easier to find help and resources when needed.

src/content/dictionary/javascript.mdx

@@ -0,0 +1,7 @@
+---
+layout: ../../layouts/word.astro
+title: 'JavaScript'
+---
+A programming language used to create interactive effects within web browsers. 
+
+Example: console.log("Hello, World!") prints "Hello, World!" to the browser console.

src/content/dictionary/mvc.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'MVC (Model-View-Controller)'
+---
+A software design pattern for implementing user interfaces. Example: In a web application, the model represents the data, the view displays the data, and the controller handles user input and updates the model.

src/content/dictionary/orm.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'ORM (Object-Relational Mapping)'
+---
+A programming technique for converting data between incompatible type systems using object-oriented programming languages. Example: Using an ORM like Sequelize to interact with a relational database in Node.js.

src/content/dictionary/restful.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'RESTful'
+---
+A style of software architecture that defines a set of constraints for creating scalable web services. Example: Using HTTP methods like GET, POST, PUT, and DELETE to perform CRUD operations on resources.

src/content/dictionary/scrum.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'Scrum'
+---
+A framework within which people can address complex adaptive problems, while productively and creatively delivering high-value products. Example: Daily Scrum meetings are a key part of the Scrum framework.

src/content/dictionary/tdd.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'TDD (Test-Driven Development)'
+---
+A software development process that relies on the repetition of a very short development cycle: first the developer writes an automated test case that defines a desired improvement or new function, then produces the minimum amount of code to pass that test, and finally refactors the new code to acceptable standards. Example: Writing a failing test for a new feature, then writing the code to make the test pass.

src/content/dictionary/ui-ux.mdx

@@ -0,0 +1,5 @@
+---
+layout: ../../layouts/word.astro
+title: 'UI/UX (User Interface/User Experience)'
+---
+UI refers to the visual elements of a product, while UX focuses on how users interact with the product. Example: Designing a user-friendly interface that enhances the overall user experience.

src/content/dictionary/websockets.mdx

@@ -0,0 +1,51 @@
+---
+layout: ../../layouts/word.astro
+title: 'WebSockets'
+---
+WebSockets are a communication protocol that allows for real-time, full-duplex communication between a client (like a web browser) and a server over a single, long-lived connection. Unlike traditional HTTP requests where the client initiates communication and the server responds, WebSockets enable both the client and server to send messages to each other at any time without the overhead of multiple HTTP requests.
+
+**How it works:**
+
+1. **Handshake**: The client sends a WebSocket handshake request to the server, indicating its desire to establish a WebSocket connection.
+
+   Client: 
+   ```javascript
+   GET /chat HTTP/1.1
+   Host: server.example.com
+   Upgrade: websocket
+   Connection: Upgrade
+   Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
+   Sec-WebSocket-Version: 13
+   ```
+
+2. **Connection Establishment**: If the server supports WebSockets, it responds with a WebSocket handshake indicating the connection is established.
+
+   Server: 
+   ```javascript
+   HTTP/1.1 101 Switching Protocols
+   Upgrade: websocket
+   Connection: Upgrade
+   Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
+   ```
+
+3. Bi-Directional Communication: Once the connection is established, both client and server can send messages to each other directly without waiting for a request.
+
+     Client to Server:
+     ```javascript
+     WebSocket.send("Hello Server!");
+      ```
+     Server to Client:
+     ```javascript
+     WebSocket.onmessage = function(event) {
+     console.log("Message from server: " + event.data);
+     };
+   ```
+**Use Cases:**
+
+- Real-time chat applications
+- Multiplayer online games
+- Live collaboration tools
+- Stock market tickers
+- Any application requiring real-time updates
+
+WebSockets offer significant advantages over traditional HTTP communication for applications requiring real-time data exchange, reducing latency and server load while providing a smoother user experience.