DEV Community: FOBABS

The Urgent Need for You to Be Security Conscious

FOBABS — Thu, 27 Feb 2025 09:00:00 +0000

The recent Bybit hack once again exposed the vulnerabilities of the digital world, sending a strong message: No one is immune to cyber threats. As financial assets, sensitive data, and personal identities become increasingly digitized, security consciousness is no longer optional—it is a necessity.

The Bybit Breach: A Stark Wake-Up Call

Bybit, one of the world’s leading cryptocurrency exchanges, recently suffered a massive security breach, resulting in hackers siphoning off over $1.5 billion worth of Ethereum. The attack, which targeted the exchange’s cold wallet, has been described as one of the largest digital heists in history.

This isn’t the first time a major crypto platform has been compromised. Binance, FTX, and Mt. Gox all fell victim to devastating hacks, shaking investor confidence and exposing flaws in centralized security systems. Yet, despite these incidents, many individuals and institutions remain dangerously complacent.

Why Security Consciousness is Critical

The Bybit hack serves as a lesson not just for crypto users but for everyone operating in the digital space. Whether you're an investor, developer, business owner, or just an everyday internet user, here’s why you need to prioritize security:

Cybercriminals Are More Sophisticated Than Ever

Hackers are constantly developing new attack vectors, from phishing scams and malware to deepfake social engineering. The moment you let your guard down, you become an easy target.
Financial and Personal Losses Can Be Irreversible

Unlike traditional banks, cryptocurrency transactions are irreversible. If your funds are stolen due to weak security measures, there’s little to no chance of recovery. The same applies to hacked bank accounts, stolen credit card details, and leaked personal data.
Trust is Hard to Rebuild

For businesses and platforms, a security breach can mean loss of users, legal liabilities, and reputational damage. It takes years to build trust, but only seconds to lose it.

What You Can Do to Stay Secure

Security starts with you. Here are some immediate steps you can take to protect yourself and your assets:

✅ Use Multi-Factor Authentication (MFA) – Always enable 2FA for exchanges, email accounts, and banking apps. A strong password alone is not enough.

✅ Store Crypto in Hardware Wallets – Never keep large amounts of cryptocurrency on exchanges. Cold wallets provide offline security against hacks.

✅ Beware of Phishing Attacks – Hackers often impersonate trusted platforms via emails, messages, or fake websites to steal login credentials. Always double-check URLs.

✅ Keep Your Software Updated – Whether it’s your phone, computer, or wallet app, always install security updates to fix vulnerabilities.

✅ Limit Data Exposure Online – Avoid oversharing personal details on social media, as cybercriminals can use this information for targeted attacks.

A Lesson for the World

The Bybit hack is not just a crypto issue—it’s a global security concern. It highlights the ever-growing need for individuals, businesses, and governments to strengthen cybersecurity defences. In an era where data is as valuable as currency, your awareness and preparedness are your best protection.

Stay vigilant. Stay secure. The digital world depends on it.

Analyzing a Suspicious Flash Loan Arbitrage Smart Contract

FOBABS — Tue, 18 Feb 2025 11:00:00 +0000

Recently, I came across a code snippet on a YouTube channel (linked via Pastebin) that claims to implement a flash loan arbitrage strategy on PancakeSwap. In this post, I’ll break down the code, discuss its intended functionality, and point out several concerning vulnerabilities.

Overview of the Code

The contract is named FlashLoanArbitrage and includes the following features:

Token Initialization:

The constructor accepts a token name, symbol, and loan amount.
Fallback Function:

A payable fallback function exists to allow the contract to receive funds.
String Manipulation Functions:

Two functions (PancakeSwapYeild and _stringReplace) manipulate strings. They appear to “modify” a hardcoded string in an attempt to generate an address.
Address Parsing:

The function parseAddr converts a manipulated hexadecimal string into an address.
Core Action Function:

The action() function transfers the entire contract balance to an address derived by exchange(), and it contains commented-out pseudocode for performing flash loan tasks and arbitrage operations.

At first glance, the contract seems to promise flash loan arbitrage functionality. However, a closer look reveals several critical issues.

Identified Vulnerabilities

1. Reentrancy and Unsafe Fund Transfers

The action() function calls:

address(uint160(exchange())).transfer(address(this).balance);

Issue:

This external call transfers all of the contract’s balance to a dynamically computed address. Since the function does not follow the Checks-Effects-Interactions pattern or uses a reentrancy guard, it could be vulnerable to reentrancy attacks if the recipient is a malicious contract.
Recommendation:

Use OpenZeppelin’s ReentrancyGuard or implement proper checks and effects before making external calls.

2. Obscure Address Calculation

The code uses two similar functions—PancakeSwapYeild and _stringReplace—to manipulate a hardcoded string:

string memory neutral_variable = "QG30C72A9E96D685CA4a74B274Eb54CBE73CCd8e8b";
PancakeSwapYeild(neutral_variable,0,'0');
PancakeSwapYeild(neutral_variable,2,'1');
PancakeSwapYeild(neutral_variable,1,'x');
address addr = parseAddr(neutral_variable);

Issue:

Instead of clearly setting an address, the contract “scrambles” a hardcoded string and then parses it into an address. This indirect method can lead to unexpected results, making it difficult to audit and verify the destination.
Recommendation:

Hardcode the intended address directly in the code or provide clear documentation and tests verifying that the intended recipient is used.

3. Lack of Access Control

Any user can call the action() function:

function action() public payable { … }

Issue:

There are no access restrictions, meaning that any caller can trigger the transfer of the contract’s balance. This could lead to unauthorized or malicious use.
Recommendation:

Implement an access control mechanism (for example, using OpenZeppelin’s Ownable contract) to restrict sensitive operations only to trusted accounts (e.g., the contract creator or a designated manager).

4. Outdated Solidity Version

The contract uses:

pragma solidity ^0.5.0;

Issue:

Solidity 0.5.0 is an outdated version. Newer versions (0.8.x and later) include built-in protections such as automatic overflow/underflow checks and improved security features.
Recommendation:

Upgrade the contract to Solidity 0.8.x to benefit from modern language features and security improvements.

5. Unnecessary and Potentially Confusing Code

There are functions like PancakeSwapYeild and _stringReplace which seem redundant and add unnecessary complexity. The comments also include “pseudo-code” for actual arbitrage functionality that isn’t implemented.

Issue:

Unused or confusing code increases the attack surface and makes it harder to audit the contract’s true functionality.
Recommendation:

Remove extraneous code and ensure that only the necessary, secure logic is present. Clear documentation of each function’s purpose is also important.

Final Thoughts

The examined code snippet promises a flash loan arbitrage mechanism but hides several vulnerabilities:

Reentrancy risk through unsafe fund transfers.
Obscure address manipulation that may lead to unexpected recipients.
Lack of access control, allowing anyone to trigger sensitive operations.
Outdated Solidity version that misses out on modern security checks.
Unnecessary code that obscures the contract’s true intent.

What Should You Do?

Exercise Caution:

If you’re considering using or interacting with such a contract, understand that its current implementation could lead to loss of funds.
Community Discussion:

Share these findings with your community to raise awareness about proper security practices in smart contract development.

Conclusion

Smart contract security is critical, especially when dealing with high-risk activities like flash loans and arbitrage. Contracts must always undergo rigorous audits before any funds are at risk. Let’s continue to build and share knowledge to keep the decentralized finance ecosystem secure.

Do you have thoughts or questions about this analysis? Feel free to leave a comment or reach out on Twitter or LinkedIn!

Smart Contract Security

FOBABS — Fri, 07 Feb 2025 11:00:00 +0000

Smart contracts power decentralized applications (dApps), automating transactions and enforcing rules without intermediaries. However, a single vulnerability can lead to millions in losses. To stay ahead of attackers, developers must actively secure their contracts, test rigorously, and follow best practices.

Common Smart Contract Vulnerabilities

1. Reentrancy Attacks

Attackers exploit this flaw by making repeated calls to a contract before the first execution completes, draining funds.

Example: The infamous DAO hack ($60M loss) exposed Ethereum’s vulnerability to reentrancy.
Fix: Follow the checks-effects-interactions pattern-update contract state before making external calls. Use reentrancy guards in Solidity.

2. Integer Overflow & Underflow

Hackers manipulate arithmetic operations to trigger unexpected behaviour.

Example: Early Solidity versions allowed unchecked math operations, leading to exploits.
Fix: Use Solidity’s built-in overflow protection (from v0.8) or the SafeMath library.

3. Access Control Flaws

Poorly designed permissions allow unauthorized users to control contracts.

Example: The Parity multisig hack ($150M loss) happened because anyone could reinitialize the contract.
Fix: Implement role-based access control (RBAC) using OpenZeppelin’s Ownable or AccessControl.

4. Unchecked External Calls

Contracts interacting with untrusted external contracts or addresses risk manipulation.

Fix: Validate responses, set gas limits, and use pull-over-push patterns to avoid forced execution.

5. Denial of Service (DoS) Attacks

Attackers force contract failures by exploiting gas limits or blocking execution paths.

Fix: Optimize contract functions, limit loops, and handle unexpected failures gracefully.

Best Practices for Bulletproof Smart Contracts

1. Use Secure Development Frameworks

Adopt battle-tested frameworks like Hardhat, or Foundry.
Leverage OpenZeppelin’s audited smart contract libraries to avoid reinventing security mechanisms.

2. Follow Secure Coding Standards

Write modular contracts to limit attack surfaces.
Use the latest Solidity version to benefit from security updates.
Avoid hardcoded values (addresses, secrets) to prevent exposure.

3. Test Relentlessly

Run unit tests for all functions.
Use fuzz testing with tools like Echidna to detect edge cases.
Simulate attacks using MythX, Slither, and Manticore.

4. Perform Security Audits

Conduct internal audits before deployment.
Hire professional auditors to review the code.
Use bug bounty programs (via Immunefi or HackerOne) to crowdsource vulnerability detection.

5. Implement Strict Access Controls

Use onlyOwner or onlyRole modifiers to restrict sensitive functions.
Adopt multisig wallets for critical operations.

6. Prevent Reentrancy Attacks

Follow the checks-effects-interactions pattern:

1. Validate user input.

2. Update contract state.

3. Interact with external contracts.

Use reentrancyGuard from OpenZeppelin.

7. Optimize Gas Efficiency

Write gas-efficient code to prevent DoS attacks.
Use Layer 2 solutions like Optimistic Rollups to reduce transaction costs.

8. Secure Oracles and External Data

Use decentralized oracles like Chainlink to avoid data manipulation.
Validate off-chain data before using it in smart contracts.

9. Monitor and Upgrade Contracts

Implement pause functions to stop transactions during emergencies.
Use upgradable contracts cautiously, ensuring proper governance and security.

Real-World Smart Contract Hacks & Lessons

1. The DAO Hack (2016) - $60M Lost

Cause: Reentrancy attack.
Fix: Implement state updates before making external calls.

2. Parity Wallet Hack (2017) - $150M Lost

Cause: Unprotected initialization function.
Fix: Lock down access control and validate contract ownership.

3. Ronin Bridge Exploit (2022) - >$615M Stolen

Cause: Weak private key security.
Fix: Use multi-sig authentication for critical functions.

Final Thoughts

Smart contract security isn’t optional—it’s the foundation of trust in decentralized applications. Developers can build secure and resilient contracts by coding defensively, testing aggressively, and auditing thoroughly. The future of Web3 depends on robust security—stay proactive, stay safe.

Learn Rust if You Don’t Wanna Be Rusty

FOBABS — Sat, 25 Jan 2025 23:16:35 +0000

Let’s face it: in the fast-moving world of tech, skills can go stale faster than that half-eaten sandwich in the back of your fridge. If you don’t want your coding chops to gather cobwebs, it’s time to meet Rust—a programming language so loved that developers practically write it love letters on Stack Overflow.

Rust isn’t just another tool in the box; it’s the shiny Swiss Army knife of programming languages. Safe, fast, and versatile, it’s like the superhero cape you didn’t know your code needed.

Rust: The Language Your Code Crushes On

Why do developers go nuts for Rust? Glad you asked:

Memory Safety: No More “Oopsies”
Rust has your back like a good friend who stops you from sending that regrettable 3 AM text. Its ownership model and compile-time checks ensure you don’t trip over pesky memory bugs like null pointers or buffer overflows. No segfaults here—just smooth sailing.
Concurrency Without Tears
Ever tried writing multithreaded code and felt like you aged ten years in the process? Rust’s fearless concurrency model catches data races at compile time. It’s like having a strict-but-loving teacher who won’t let you fail.
Web3’s Secret Sauce
If Web3 is the future, Rust is the rocket fuel. Blockchain platforms like Solana and Polkadot are already partying with Rust because it delivers safety, performance, and that je ne sais quoi that Web3 needs.
Ecosystem Perks: Cargo Cult (in a Good Way)
Rust comes with Cargo, a package manager so good it’s like the personal assistant you wish you had IRL. Add in tools like Clippy (not the annoying paperclip, promise) and Rustfmt, and you’ll wonder how you ever coded without them.

How to Start Your Rusty Journey

Here’s your step-by-step guide to becoming a Rustacean (yes, that’s the official term, and no, it doesn’t mean you have to grow claws):

Crack Open The Rust Book
This is your Bible, your survival guide, your best buddy on the journey. It explains everything with the patience of a saint and the clarity of a sunny day.
Build Something Cool (or Silly)
- A command-line to-do list (bonus points if it yells at you for procrastinating).
- A bot that sends you dry jokes at random intervals.
- A mini blockchain (because why not flex on your LinkedIn?).
Join the Rust Herd
Rust’s community is one of the nicest corners of the internet. Ask questions, share memes, and find out why Rust developers are basically a cult but without the weird chanting.
Level Up Like a Pro
Ready to go beast mode? Tackle Rust’s more advanced features, like lifetimes (not as scary as they sound) or async programming (Rust makes it fun, promise).

Rust in Real Life

Rust isn’t just the hot new kid on the block; it’s the one who’s acing math, winning the talent show, and somehow still has time to volunteer. Companies are using Rust to build blazing-fast games, rock-solid servers, and next-gen blockchain platforms.

If you want your résumé to scream “hire me,” a line about Rust might just do the trick.

Conclusion: Rust Never Sleeps

In a world where programming languages come and go like TikTok trends, Rust is built to last. It’s fast, safe, and versatile—kind of like your favourite superhero but without the spandex.

So, don’t be that developer who gets left behind in the dust of obsolete skills. Pick up Rust, and watch your code (and your career) shine like never before.

PS: If you don’t, you might end up...well...rusty.

Foundry vs Hardhat (A story version)

FOBABS — Fri, 06 Dec 2024 11:30:00 +0000

Imagine you're a blockchain developer stepping into a vast, digital forest, armed with a single goal: to build secure, efficient, and groundbreaking decentralized applications. In this forest, two guides approach you—each offering their unique path. One is Foundry, a sharp, efficient, and focused blacksmith. The other is Hardhat, a versatile and resourceful craftsman. Both are eager to help you, but their methods differ greatly.

The Path of Foundry: The Swift Blacksmith

Foundry greets you with a confident, no-nonsense demeanour. “I offer speed,” it declares, precisely hammering a glowing piece of metal. Foundry is built on Rust, exuding an aura of strength and efficiency. With it, you dive straight into Solidity. It doesn’t clutter your journey with unnecessary tools—it’s just you, your code, and pure performance.

As Foundry sharpens your tools, you notice its minimalism. It provides Forge for testing, Cast for interacting with contracts, and Anvil for simulating blockchain environments—all tightly integrated and lightning-fast. Foundry’s domain is the realm of advanced warriors who value speed and precision. It whispers, “Your tests will run faster, your code will compile swifter, and your blockchain simulations will be seamless.”

But Foundry demands discipline. It expects you to stay within its sharp, well-defined boundaries. “I am not for the faint of heart or the easily distracted,” it warns. It’s perfect for those who already know the battlefield or are ready to embrace a steeper learning curve.

The Path of Hardhat: The Versatile Craftsman

On the other side of the forest stands Hardhat, with a warm, approachable smile. Tools of every kind hang from its belt—some old, some new, all well-used. “Flexibility is my gift,” Hardhat says, as it hands you a set of instructions and a box of modular tools. It thrives on JavaScript, a language familiar to many adventurers from the web2 world.

Hardhat’s camp is bustling with life. Its tent is surrounded by a vibrant community, a marketplace of plugins, and endless tutorials. It invites you to pick and choose from its arsenal: debugging tools, deployment scripts, integrations with libraries like Ethers.js, and plugins like Hardhat Deploy.

As you follow Hardhat’s path, you realize its strength lies in its flexibility. It caters to those just beginning their journey, guiding them gently, but it’s also ready for seasoned veterans who need a versatile toolkit. “I am for the explorers, the creators who want to mould their journey into something unique,” it says.

However, Hardhat’s many tools come with a cost—speed. Its Node.js-based architecture lags behind Foundry’s Rust-powered swiftness. But for many, the trade-off is worth it, as Hardhat’s path is well-trodden and friendly to newcomers.

Two Paths, One Destination

As you stand between these two guides, the choice becomes clearer.

Follow Foundry if you crave the thrill of speed and efficiency, the joy of mastering a streamlined, high-performance toolset, and the satisfaction of working directly with Solidity without extra frills.
Choose Hardhat if you value flexibility, a bustling ecosystem, and the comfort of a familiar JavaScript environment.

In the end, both paths lead to the same destination: building exceptional decentralized applications. The question is, which guide will you trust to lead you through the forest?

The choice is yours. The forest awaits. 🌲

The beginning of dsa-scripts

FOBABS — Thu, 21 Mar 2024 11:00:00 +0000

fobabs / dsa-scripts

This contains solutions to some data structures and algorithms problems.

Data Structures and Algorithms Solutions

This contains solutions to some DSA problems in JavaScript, Typescript, Python, Rust and Bash.

If you like the project, kindly give it a star. It means a lot to me.

Contributing

Contributions are always welcome!

If you want to help us improve, take a minute to read the Contribution Guidelines first.
If you find a problem with a specific code, please open an issue.
If you want to get your hands dirty by fixing issues and bugs, fork the project.
Please adhere to this project's code of conduct.

Feedback

If you have any feedback, please reach out to us at hi@fobabs.co.

View on GitHub

In the field of computer science, mastering data structures and algorithms (DS&A) is paramount. However, the journey to proficiency can be arduous, requiring extensive practice, experimentation, and often the use of various resources. Faced with this challenge myself, I embarked on a mission to document my data structures and algorithms journey, ultimately leading to the creation of dsa-scripts. This was born out of a desire to strengthen my knowledge of data structures and algorithms, and I intend to have support for a good number of programming languages, with JavaScript and Typescript already included.

dsa-scripts intends to offer a rich repository of meticulously crafted scripts covering a wide array of DS&A topics, ranging from fundamental data structures like arrays and linked lists to advanced algorithms such as dynamic programming and graph traversal.

In addition, it will provide problem sets and solutions tailored to reinforce specific concepts or algorithms. These problem sets and solutions will challenge users to apply their knowledge to solving real-world problems, thereby solidifying their understanding and honing their problem-solving abilities.

In an era where proficiency in DS&A is synonymous with technical excellence, it emerges as a catalyst for accelerating skill development and fostering a culture of continuous learning. Combining practical utility with educational value, dsa-scripts empowers individuals to embark on a transformative journey towards mastery of data structures and algorithms, one script at a time.

If you love this idea and want to be a part of it, kindly fork the project on GitHub and follow the contributing guidelines available. If you do not want to contribute but want to be a spectator, you can star the project.

fobabs / dsa-scripts

This contains solutions to some data structures and algorithms problems.

Data Structures and Algorithms Solutions

This contains solutions to some DSA problems in JavaScript, Typescript, Python, Rust and Bash.

If you like the project, kindly give it a star. It means a lot to me.

Contributing

Contributions are always welcome!

If you want to help us improve, take a minute to read the Contribution Guidelines first.
If you find a problem with a specific code, please open an issue.
If you want to get your hands dirty by fixing issues and bugs, fork the project.
Please adhere to this project's code of conduct.

Feedback

If you have any feedback, please reach out to us at hi@fobabs.co.

View on GitHub

How to deploy a Nest app to Railway using Bitbucket pipelines

FOBABS — Fri, 23 Feb 2024 11:00:00 +0000

Deploying a project from GitHub to Railway is as straightforward as knowing your name, but there's more when deploying from Bitbucket. Many of us love Railway because it offers features that we (developers) find beneficial, such as easy deployment workflows, scalability, good performance, cost-effectiveness, and robust support for various programming languages and frameworks. For me, it's just a "plug-and-play" app.

The aggravation I felt knowing that Railway did not natively support Bitbucket prompted me to devise a workaround.

💡
Just for laugh: Railway only support "Big Boys" 😆

After a futile search through the internet pages, expecting to locate an existing solution, an inspiration struck me: what if all I had to do was construct a deployment pipeline, like Railway had done behind the scenes for GitHub? That struck a chord in my mind.

If you have been trying to achieve this, sweat no more; you can now deploy from Bitbucket using CI/CD (bitbucket pipelines).

💡
Just for laugh: You can tell Railway you're a "Bigger Boy" now 😆

Without further ado, let’s begin.

Prerequisites:

A Bitbucket account.
A Railway account already setup. (If you do not already have an account, you can create one here)

In the root folder of your application, create a file called bitbucket-pipelines.yml and add the following code snippet:

image: node:18

clone:
  depth: full

pipelines:
  branches:
    main:
    - step:
        name: Deploy to railway
        caches:
          - node
        deployment: production # Only if you have more than one environment
        script:
          - npm i -g @railway/cli
          - RAILWAY_TOKEN=$RAILWAY_TOKEN railway up --service=$RAILWAY_SERVICE

NOTE: Please take note of the indention. Any incorrect indentation will render your pipeline invalid.

To avoid "story that touches," you can validate your pipeline before pushing to Bitbucket using this link: https://bitbucket-pipelines.prod.public.atl-paas.net/validator

After you've validated your pipeline with VALID status, you can push your repo to Bitbucket.

Just a step back, if you're a DevOps engineer, this pipeline is simple math; but, if you're unfamiliar with CI/CD pipelines, this may appear to be a mirage to you.

Check out the official documentation to fully understand Bitbucket pipelines. To gain a basic grasp of CI/CD, check this article: https://itnext.io/ci-cd-an-introduction-using-bitbucket-pipelines-8701a400b97d

Now, let me walk you through the pipeline I just constructed.

I used node v18 as my image, but you can use any node version you wish. One thing I enjoy doing is caching node to minimize build time; you should do the same.

Take heed of this line.

deployment: production

This is unnecessary if you just have one deployment environment, but in practice, you will have several environments. This line instructs Bitbucket which environment variables to deploy. In our instance, it is the production environment, which implies that our pipeline will deploy utilizing variables from that environment. I'll go into how you can do this later.

Let us now go on to the last line, which completes the railway deployment.

- RAILWAY_TOKEN=$RAILWAY_TOKEN railway up --service=$RAILWAY_SERVICE

You'll notice $RAILWAY_TOKEN and $RAILWAY_SERVICE. These two variables will serve as your environment variables later on, and they are required to start our pipeline.

For you to connect to your railway project, you'll need a railway token and a service ID to identify the exact service for which your project is hosted, but to achieve that, you have to set up your railway project.

Step 1: First, start a new project and select Empty Project .

Step 2: After your project has been created, you’ll see the following image prompting you to add a service. Simply follow the process of adding a service.

Step 3: Now it's time to acquire your token and service ID. Click on the service you created, as illustrated below:

Navigate to the page address, and you'll notice a URL string in this format:

https://railway.app/project/<project-id>/service/<service-id> .

Copy <service-id> which is your service ID, and save it somewhere for later use, as this will serve as your $RAILWAY_SERVICE.

Now click on the Tokens tab. Create a new token with any name of your choice. I opted to use BITBUCKET_DEPLOY to signify that this token is intended for usage with Bitbucket.

Copy the token immediately and securely store it as previously described, since this will function as your $RAILWAY_TOKEN.

NOTE: You will only be shown the token once, after which you will be unable to copy it again.

Step 4: Check the build and start commands by accessing your service's settings page. NOTE: The default build and start commands are npm run build and npm run start respectively. If your project requires a different command, adjust it accordingly.

Step 5 (optional): If your project requires environment variables, which is the case in real life, proceed to the Variables tab.

Click on RAW Editor .

Under the ENV tab, paste your .env variables from your nest app and hit the Update Variables button, and you're done.

Now, let's return to your Bitbucket repository and configure your pipeline. Click on Repository settings, go down to Settings, and then change Enable Pipelines to true.

After that, click on Deployments and scroll down to choose the production environment, since you will be deploying to this environment. Create the variable RAILWAY_TOKEN and put the token you saved previously into it. Before adding it, ensure that the Secured option is set to true.

NOTE: This page allows you to manage variables for various deployment environments.

Next, navigate to Repository Variables. Create a RAILWAY_SERVICE variable and put the service ID you saved previously into it. Also, before adding, ensure that the Secured option is set to true.

Hurray! 💃 Your pipeline is ready to receive oil.

Now, return to your repo, choose the Pipelines tab, run the pipeline by clicking the Run initial pipeline button, and follow through with the procedures.

If the pipeline is successful, you should see the following:

Bravo! Now let's return to Railway to observe your deployment.

You can see that your project is now being deployed. After it is successful, you will see the following:

At this point, your project has been successfully deployed. You may view the logs and see them for yourself.

Now you can easily deploy from Bitbucket to Railway. My work here is done till we meet again.

P.S. You can also use this pipeline for other projects.

Hacktoberfest 2020: Looking for a small project to contribute to

FOBABS — Thu, 22 Oct 2020 21:26:56 +0000

It's never too late to make your pull requests. Even though today is the 22nd day, you can still be a part of hacktoberfest by contributing to this small Javascript projects

10 Days of JS: https://github.com/fobabs/10-Days-of-JS
Date Picker: https://github.com/fobabs/date-picker

How I built a typical Ubuntu Terminal using HTML & CSS

FOBABS — Wed, 06 May 2020 08:41:20 +0000

I woke up one morning and felt the need to test my HTML & CSS skills without using any library nor framework. This is to test how well I understood HTML & CSS.

Today, many young developers don’t like taking the time to understand how HTML and CSS work under the hood before delving into front-end frameworks like React, Angular, Vue, etc. They all want to jump into using the tools and technologies to build apps. I know that feeling too. I was once at that state.

Without Further Ado, let’s get down to business.

In my project root directory, I created an index.htm file using my text editor and input the following boilerplate to start with:

<!DOCTYPE html>
<html>  
  <head>    
    <meta charset="utf-8">    
    <meta http-equiv="X-UA-Compatible" content="IE=edge">        
    <title>Ubuntu Terminal</title>    
    <meta name="description" content="">    
    <meta name="viewport" content="width=device-width, initial-scale=1">    
    <link rel="stylesheet" type="text/css" href="style.css"/>
  </head>  
  <body>  
    <!-- Body Section -->
  </body>
</html>

As you read through, you’ll notice I made use of 2 HTML5 semantic elements <main> and <section> introduced by W3C to clearly define elements.

You should also consider using HTML5 semantic elements in your next project.

Now, in the body section, I first inserted the main tag, giving it an id attribute of container and nest a div tag with an id attribute of terminal. I then sectioned the terminal into two (2) parts: the terminal bar and the terminal body. For the terminal bar section, I used a section tag with an id attribute of terminal__bar while the terminal body section takes a section tag with an id attribute of terminal__body.

I don’t want to go into many details so I don't bore you. You all want to see codes, not epistles.

The code snippet below shows everything you need to see. I believe even a newbie would understand what has been done there.

<main id="container">
  <div id="terminal">
    <!-- Terminal Bar -->       
    <section id="terminal__bar">          
      <div id="bar__buttons">            
        <button class="bar__button" id="bar__button--exit">&#10005;</button>            
        <button class="bar__button">&#9472;</button>                
        <button class="bar__button">&#9723;</button>          
      </div>          
      <p id="bar__user">fobabs@ubuntu: ~</p>        
    </section>        
    <!-- Terminal Body -->        
    <section id="terminal__body">          
      <div id="terminal__prompt">            
        <span id="terminal__prompt--user">fobabs@ubuntu:</span>            
        <span id="terminal__prompt--location">~</span>            
        <span id="terminal__prompt--bling">$</span>            
        <span id="terminal__prompt--cursor"></span>          
      </div>        
    </section>      
  </div>    
</main>

The BEM methodology in naming my class and id attributes was used here

Now done with the skeletal work of the terminal, it’s time to add some beauty.

@import url('https://fonts.googleapis.com/css?family=Ubuntu');
@import url('https://fonts.googleapis.com/css?family=Ubuntu+Mono'); 
body {  
  background: linear-gradient(45deg, #57003f 0%,#f57453 100%); 
  font-family: Ubuntu;
} 
#container {  
  display: flex;  
  justify-content: center;  
  align-items: center;  
  height: 100vh;
} 
#terminal {  
  width: 70vw;  
  height: 65vh;  
  box-shadow: 2px 4px 10px rgba(0,0,0,0.5);
} 
#terminal__bar {  
  display: flex;  
  width: 100%;  
  height: 30px;  
  align-items: center;  
  padding: 0 8px;  
  box-sizing: border-box;  
  border-top-left-radius: 5px;  
  border-top-right-radius: 5px;  
  background: linear-gradient(#504b45 0%,#3c3b37 100%);
} 
#bar__buttons {  
  display: flex;  
  align-items: center;
} 
.bar__button {  
  display: flex;  
  justify-content: center;  
  align-items: center;  
  padding: 0;  
  margin-right: 5px;  
  font-size: 8px;  
  height: 12px;  
  width: 12px;  
  box-sizing: border-box;  
  border: none;  
  border-radius: 100%;  
  background: linear-gradient(#7d7871 0%, #595953 100%);  
  text-shadow: 0px 1px 0px rgba(255,255,255,0.2);  
  box-shadow: 0px 0px 1px 0px #41403A, 0px 1px 1px 0px #474642;
}
.bar__button:hover {  
  cursor: pointer;
}
.bar__button:focus {  
  outline: none;
}
#bar__button--exit {  
  background: linear-gradient(#f37458 0%, #de4c12 100%);    
  background-clip: padding-box;
} 
#bar__user {   
  color: #d5d0ce;  
  margin-left: 6px;  
  font-size: 14px;  
  line-height: 15px;
} 
#terminal__body {  
  background: rgba(56, 4, 40, 0.9);  
  font-family: 'Ubuntu Mono';  
  height: calc(100% - 30px);  
  padding-top: 2px;  
  margin-top: -1px;
} 
#terminal__prompt {  
  display: flex;
}
#terminal__prompt--user {  
  color: #7eda28;
}
#terminal__prompt--location { 
  color: #4878c0;
}
#terminal__prompt--bling {  
  color: #dddddd;
}
#terminal__prompt--cursor {  
  display: block;  
  height: 17px;  
  width: 8px;  
  margin-left: 9px;  
  animation: blink 1200ms linear infinite;
} 
@keyframes blink {  
  0% {    
    background: #ffffff;  
  }  
  49% {    
    background: #ffffff;  
  }  
  60% {    
    background: transparent;  
  }  
  99% {    
    background: transparent;  
  }  100% {    
    background: #ffffff;  
  }
} 
@media (max-width: 600px) {  
  #terminal {    
    max-height: 90%;    
    width: 90%;  
  }
}

Checking the CSS code above, you’ll notice I made use of ubuntu fonts to make the terminal look “Ubuntuish”. I believe it is understandable enough to comprehend.

“Et voilà!”. I believe you enjoyed me.

P.S. I hope to add some interactivity and functionalities to make it a full-fledged app in the future. If you want to contribute to the project, you can fork it on GitHub with the link below:

GitHub - Ubuntu Terminal

Don’t forget to follow me here on Dev for more curated tech stuff.

You can also follow my activities on Facebook, Twitter, LinkedIn, and Instagram.

HackerRank’s 10 Days of JS

FOBABS — Fri, 03 Apr 2020 13:06:00 +0000

Many programmers out there may likely have difficulties in solving some of the HackerRank’s 10 Days of JS practice, some may even abandon it for something else.

This reason prompted me to make my solutions open-source on GitHub for everyone taking up the practice to learn from. All you have to do is click on the link below:

https://github.com/fobabs/10_Days_of_JS

How to manually create a workspace in VSCode

FOBABS — Mon, 16 Dec 2019 14:26:47 +0000

The usual convention of creating a workspace in VScode is by adding the working folders you desire in the workspace and saving it with any name of your choice.

For example, we have an existing workspace named “coding.code-workspace” with three working folders: fobabs-app, JavaScript and FOSS as shown below:

But what if you want to do it manually, then you’ll have to create a file named example.code-workspace and add the following code into it.

Take note of the “.code-workspace” extension.

{
  "folders": [
    {
      "path": "JavaScript/fobabs/fobabs-app"
    },
    {
      "path": "JavaScript"
    },
    {
      "path": "JavaScript/FOSS"
    }
  ]
}

Looking at the code, you can see they are in JSON format which makes it cool 😎 if you are already familiar with JavaScript Objects. The above code is for folders in the same directory and sub-directories. Let’s say you want to add a folder from a different directory, all you have to do is to do add the file path as shown below depending on your OS installed:

{
  "folders": [
    {
      "path": "JavaScript/fobabs/fobabs-app"
    },
    {
      "path": "JavaScript"
    },
    {
      "path": "JavaScript/FOSS"
    },
    {
      "path": "/home/fobabs/Desktop/facebook-clone"
    }
  ]
}

Now, you’re just a few steps to becoming a VSCode Ninja 🦹‍♀️.

My New Profession as an Artist

FOBABS — Sat, 24 Aug 2019 18:57:19 +0000

I know what comes to mind when you hear the word ”Artist” is being an actor, a painter, comedian, musician or whatever an Artist mean to you but let me re-orientate you.

An Artist is someone who does something with great skills or someone who creates work as a form of expression. It can be inspired by virtually anything that has meaning to the artist, or it can be an exercise in randomness. It can involve very complex and profound concepts or a subconscious zen-like execution. Art does not have to have an audience to exist. It only needs to have the artist.

I will be using the software development as a case study in a moment from now.

A house painter isn’t an artist just because he uses some of the same tools as an artist. The intent is what matters.

When a writer hammers away at a typewriter, he’s creating his art. A musician composing a piece of music is creating her art. To say that a person writing code for a program cannot be art is like saying the writer hasn’t created his work until it has been published or the musician’s work doesn’t exist until it has been performed. Someone who can’t read music may not be able to experience it by looking at the sheet music and a blind person may not be able to experience painting, but the works still exist.

Most, but not all, art forms share some common attributes. Those are the inspiration, process and technology. Painters prepare the canvas, they select their brushes, they arrange their materials and workspace. Art doesn’t begin when the artist first applies paint to his canvas or sketches the contours of his composition. It began when he was at the market, was inspired by an arrangement of produce, and began the act of selecting different items for his still life. The painting may never get finished, but that doesn’t disqualify it. It’s still art when the painter is working on it. The only thing that separates a painting that never gets finished and one that does is the artefact that gets left behind. That’s all that matters to some people because it’s the only thing of value, it’s the only way they can experience it. But that’s not what art is all about.

A programmer may be motivated to code a piece of software to explore a concept in his own mind. If the intent is to create that as a work of art, then he’s creating art. He may see the beauty in code others have written, or see the beauty in patterns generated at random, but those are his inspiration. The computer and the code are his technology instead of a paintbrush and canvas. When he executes and debugs and fine-tunes his code in an effort to see where it takes him, that’s his process. It may end with no one else ever seeing his work and the code fail to execute as intended, but those never take away from the fact that he set to create some sort of artistic expression. Art involves failure too.

Software development is more art than science. Sure, the programming languages that comprise software development have rules and are highly systematic, but the application of these languages is an artistic, highly individual creation. Each piece of software reflects the individual who created it. No two pieces of software are identical. It is this highly individual nature of software creation that makes it so artistic, so one-of-a-kind.

I think the real value of being a software artist is that you don’t quantify, you constantly improve. When you design a project, constantly ask yourself: can this project be designed better? When you write code, after testing all the functionality, sit back, look at it, and ask yourself:

is this code structured beautifully as the finest artwork you have ever seen?

So as Software engineers consider yourself more of a Software artist. Software engineers will stop improving their projects once they checked all the checkboxes, software artists do not have those checkboxes because their work is already above the standards. As a software artist, once you settle down on measuring your project against some baselines, your project is no longer an artwork because you would not challenge yourself any more.
Artists usually influence other people by what they do and/or what they produce. Uber has transformed the transportation industry, creating standards in the market and has inspired others to do the same. This is where art comes to play, you design the foreseeable future. When architecting a design or a concept, think about it if it can stand the test of time or it is just a fashion.

In a nutshell, you become an expert when you are more of an artist in your field. Looking at Leonardo Da Vinci, the greatest artist the world has ever had, he employed artistry in all his areas of interest like invention, drawing, painting, sculpture, architecture, science, music, mathematics, engineering, literature, anatomy, geology, astronomy, botany, palaeontology and cartograph. So regardless of your area of specialization, incorporate art into your craft. It singles you out from the crowd.

I am more of an Artist than what you think I am.

Inspired from:

https://illumisoft.com/software-development-art-science/

https://www.quora.com/Could-computer-programming-be-considered-an-art-form

https://hackernoon.com/dont-be-a-software-engineer-be-a-software-artist-204dbd47e8ca