Hashnode·4ySystem Design: The complete course
System design is one of the earliest decisions we can make when building a system. System design meets the needs of your business or organization through coherent and efficient systems. The OSI Model can be seen as a universal language for computer networking. It's based on the concept of splitting up a communication system into seven abstract layers, each one stacked upon the last.
Hashnode·4yThe 60:30:10 color rule for web design
Color plays such an important rule in the design of your websites or apps. The 60% is the neutral or primary color this should be the base color of your design. The 30% is secondary color this is the complementary color and will support the main color.
Hashnode·4yBuild your first Electron app
Electron is a free and open-source framework maintained mainly by GitHub. It powers dozens of apps, including Discord, Slack, Notion, VSCode, Spotify, and many more. The framework is designed to let developers create desktop applications using web technologies such as JavaScript, HTML, and CSS.
Hashnode·4yUnit testing with Jest, React, and TypeScript
Software testing is critical to lower the chances of our program failing by running tests with the end-user in mind. Testing-library/react is a testing utility tool that's built to test the actual DOM tree rendered by React on the browser. The goal of the library is to help you write tests that resemble how a user would use your application.
Hashnode·4yHow I got my 1st job as a developer by making simple projects seem big
Julia is a self-taught front-end developer in his thirties who switched career into tech after studying Japanese and musicology while working part-time at a casino. She created a simple calculator using JavaScript using HTML, SCSS, JavaScript, hosted on GitHub pages to run the app. She later updated the code and created some mixins to familiarize herself with it.
Hashnode·4yA Complete Guide to Debugging Javascript in Chrome
Chrome DevTools is a comprehensive developer toolkit with various web authoring and debugging tools. It is built directly into the Chrome browser and gives developers a deeper understanding of their applications. This article teaches you how to debug JavaScript code using the Chrome Dev tools.
Hashnode·4yHow to Debug Better with Chrome
Google Chrome is probably the most widely used and popular web browser among developers. It has gradually become the preferred web browser for most developers to test and debug their websites and web apps. Google Chrome provides developers with the ability to debug most web applications with the built-in developer tools (aka DevTools) within the browser.
Hashnode·4yJavaScript Callbacks Explained in 5 Minutes
Let's cover the basics of callbacks in about 5 minutes with a handful of examples. Callbacks are an essential part of understanding JavaScript especially when dealing with asynchronous code. Let's create our own version of the forEach() function to get a clearer idea of how callbacks work.
Hashnode·4yCreate a new React app with Vite
Vite: Enables Hot Module Replacement (HMR) Helps you import and manage your project and manage. With one command and a few seconds, it can generate all the above boilerplate for you and more. It’s fast, and you keep your application state if you want. HMR saves time you would otherwise spend waiting around or inputting data to recreate your app state. It reduces friction.
Hashnode·4yWeb-based all-in-one gradient editor.
Gradientify is a free online tool that provides 100+ trendy, beautiful, carefully crafted gradients for your apps, blog, UI design or to be used as content backgrounds. It is open source and you can use it for free without attribution. Save gradients, Search gradient by Hex, add new gradients and add newGradients and dark mode.
Hashnode·4yHere's what every React Developer needs to know about TypeScript - Part 1
TypeScript is an open source language developed and maintained by Microsoft. It is a multi-paradigm language (like JavaScript) Allows the use of static types Extra features (generics, interfaces, tuples, etc) Allows for gradual adoption*.
Hashnode·4yMongoDB schema design best practices
MongoDB is a document-oriented NoSQL database that can store large amounts of data in a JSON format. It has a faster execution than RDBMS. This article will help you understand the theoretical core concepts of MongoDB that can be used to improve scalability and performance.
Hashnode·4yGet Started With Flexbox
This one-dimensional layout allows elements to be placed inside a container with evenly distributed space. This layout makes elements responsive, which means they change their behaviour depending on the type of device that is displaying them. It gives elements flexibility as well as appropriate position and symmetry.
Hashnode·4yI made a Discord bot using JavaScript in 4days!
Fueler is a new age portfolio tool that helps skilled individuals prove themselves by showcasing their work. It just takes 30 seconds to setup your profile on Fueler and its totally free. The idea came when I discovered slash commands in discord and here I could easily categorize them inside slash commands.
Hashnode·4yLearn how to build a microservice using Node.js and RabbitMQ.
Learn how to build a microservice using Node.js and RabbitMQ. This tutorial will teach you about microservices and how to create a simple e-commerce microservice architecture with two services; product and order. In the following section, we will look at some of the prerequisites for this tutorial. Make another folder for the routes, call it routes, then inside it, have a file routes.
Hashnode·4yHow open source can boost your career as a developer?
Many junior or entry-level developers struggle to get opportunities because of little or no work experience. Becoming a contributor at that early stage has its advantages, like people getting to know you better, your contributions to the project can be easily felt. A lot of top projects with over 30,000+ stars we use and love today once started small and un-noticed.
Hashnode·4yFabric: The new Architecture
Fabric is the React Native forerunner to the old legacy renderer. Fabric takes a different approach to how UI view instances will be created in a React Native application. The new Fabric architecture changes none of this but builds on it, making the experience even more platform specific.
Hashnode·4ySimplifying Closures in JavaScript
Lexical Scoping defines the scope of a variable according to the position of that variable declared in the source code. This refers to the variables defined between its curly brackets. Once we use the let keyword in the for-loop, it will create a new lexical scope in each iteration. This means that the previous value of j is copied from the previous scope to the new one.
Hashnode·4yDocusaurus 2.0 🥳️: Meta's static site generator to build beautiful documentation websites
Docusaurus 2.0 is a documentation static-site-generator, based on Node.js and React. It allows you to focus on content: just write Markdown files. It is already powering many great docs sites you know: React-Native, Redux, Tauri, Electron, Courier, Figma.