Hashnode·4yHow to Create a Legendary GitHub Profile?
I just started blogging here on Hashnode a few weeks ago. Only after I posted my first article realized that Hashnode is much more about than just writing. The greatest opportunity actually is reading. I read whenever I am travelling, smoking or walking on the street and sometimes even on the toilet. I am constantly browsing the Recent section of the Hashnode app.
Hashnode·4yHow to design better APIs
When creating an API from scratch, you need to get many details right. From basic security considerations to using the right HTTP methods, implementing authentication, deciding which requests and responses you should accept and return, ... the list goes on. In this post, I'm trying my best to compress everything I know about what makes a good API.
Hashnode·4yCSS Tricks to Create that Dark Futuristic Web3 Look
The Graph, ARCx Money, Buildspace, Rabbithole, Sushi Swap, and Rare Blocks all have some common designs that achieve this look. Here are some simple styles you can add to your app:Gradient Glowing effect Bright and white text over a dark background Semi transparent backgrounds A quick and easy transition on hover.
Hashnode·4yWriting Cleaner CSS using BEM Methodology
The Block Element Modifier methodology (abbreviated BEM) is a popular naming convention for HTML and CSS classes. It helps to keep your code organized and maintainable. BEM is mostly used when you have a project that has multiple pages, HTML selectors and a large code structure.
Hashnode·4yReact useEffect Hook usages you must know
React is a JavaScript-based user interface library. React components are isolated reusable pieces of code logic with their own UI. React provides many standard in-built hooks to manage states, isolate side effects, create references, improve performance, etc. We can also create custom hooks, which are just JavaScript functions with access to many React features. We will learn six usages of useEffect hook to run and clean up a side effect.
Hashnode·4yYou can't do everything*
Developer: I've personally found myself taking on too many hobbies than I know what to do with. There is simply, no sustainable way to do everything. Accepting that you can't do everything is your secret ticket to getting ridiculously good at smaller set of hobbies you focus on.
Hashnode·4y5 Secret features of JSON you didn't know about 🤯
The default stringifier also minifies the JSON, which looks ugly. It can do cool stuff like revive data, use a custom format to encode/decode data, hide certain properties in stringified data, and format your data. Let's dive into some of the cool features.
Hashnode·4yLocal Storage and Session Storage (JavaScript)
Local storage and session storage store key-value pairs. Local storage stores an array as a string, while session storage stores a pair. To get an array from local storage, we use JSON.parse. In order to remove a particular key- value pair, we can use localStorage.remove.
Hashnode·4yGitLive now works with any Git repository in VS Code!
GitLive now works with any Git repository in VS Code. The offline mode uses the data from your local Git repository only. The changes from the branches shown in the GitLive tab also appear for your current file in the gutter of your editor. It even shows you when the changes conflict with your own - a kind of early warning system for merge conflicts.
Hashnode·4yCSS Logos: Netflix logo
The Netflix logo is built up by three sticks of the same size; however, the middle one casts a shadow and is skewed. We'll leverage borders for the two side pillars and pseudo-elements to make the skew stick + the rounded bottom section. The result is the following CodePen.
Hashnode·4y10 amazing games to learn CSS
There are some fun ways to learn this monster called CSS. Learning CSS can be quite a challenge, and you will have to get your hands dirty. This article will highlight ten amazing games you can play to learn CSS. Once you've mastered these games, you can enter some CSS challenges and battles.
Hashnode·4y🧑💻 Building CLIs with React Ink
React Ink is a library that lets you build command-line apps with React. It uses Yoga to build Flexbox layouts in the terminal, so most CSS-like props are available in Ink as well. In this post, we’ll explore how Ink works by building a cool little CLI, that fetches info about Pokemon using PokeAPI!
Hashnode·4yHow to create a custom scrollbar with CSS in 5 mins
Using CSS we can add personality to our site’s design with custom scrollbars. The code below will work with most modern browsers and operating systems. To create a custom scrollbar, we must first define the size of the scrollbar. We can style it by adding background colors, shadows, border radius, and borders.
Hashnode·4yDesma - A design system manager for all your projects
Desma is a design system manager where you can create, preview and host all your designs in one single place. The idea of desma is to save multiple features that a design can hold at once. The database relational model consists of User, DesignSystem, Palette, Fonts, Spacing and Color.
Hashnode·4yIntroducing Hyperdocs - The simplest way to build docs for your project.
Hyperdocs is a documentation generating tool that fetches markdown files from a docs folder from GitHub, generates it on the server and sends it to the client. It also provides a blog for each project created so that you can make your new release announcements and other news there. It provides a feedback collection system that helps you gather feedback from your project.
Hashnode·4yMoodflix - Your mood, Our suggestions
Moodflix is a Netflix-clone built with React and Framer Motion. The frontend is written in React and SCSS and the backend is in .NET 6 and .NET Core 6 and Minimal API. The API receives the base64 string image from the Frontend and sends it to the Azure Face API directly. Backend gets a list of movies based on the user's mood.
Hashnode·4yCSS Logos: Hashnode logo
I wanted to start this CSS challenge a while ago by recreating some fantastic logos in CSS only. I'll be starting with Hashnode, as I re-created this recently for the CSS Hashnode challenge. The mask option is a powerful tool to mask out parts of your elements. The background shows through the logo, excellent!
Hashnode·4yHow I made Postman Clone using HTML, CSS & JavaScript
Postman is a popular application programming interface that makes it easy for developers to create, share, test and document APIs. In this tutorial, we are going to build a website using Postman and Bootstrap. For this project, we will use the Visual Studio Code.
Hashnode·4yFrom an ex-Amazon team lead: 5 mistakes I made as a junior software engineer
Former Amazon Web Services engineer shares 5 mistakes he made as a junior software engineer. He says he had entitlement, focused on minutiae in code reviews, and didn't ask for a promotion. He learned to be more transparent about his career goals and aspirations, and seized promotion opportunities. He also learned to focus on the business value and impact of his work.
Hashnode·4yFree resources to learn Rust in 2022 🦀
Rust is the most loved programming language, according to the Stack Overflow Developer Survey 2021. For the sixth year in a row, it has won the title. This article contains free resources to assist you in getting started with Rust. Each resource includes a brief summary to help you in making the best choice.
Hashnode·4yCSS Interview Questions
Cascading Stylesheet Sheet is a stylesheet language that determines how the elements and content should look on the page. CSS is used to develop a consistent look and feel to the webpage. In today's world of tech, it's not easy to land a job while it's impossible to know answers to all questions that an interviewer may ask you.
Hashnode·4yCSS Vs CSS Modules
React allows you to create different components for your application. Since each component has its own stylesheet, you wouldn't want those stylesheets to override one another. The goal of CSS Modules is to protect overlapping class names. The best part is, it is actually simple and straightforward.
Hashnode·4yCreate Infinite Scroll In React
Infinite scroll works in much the same way that normal website browsing works, behind the scenes. There are mainly three components of infinite scroll. Fetching data from the paginated api, maintaining the data state on the website and detecting user scroll. We will use react-infinite-scroll-hook in this blog.
Hashnode·4yThe Story Behind How We Started Medusa
Sebastian Rindom, the CEO & Co-founder of Medusa, did an interview with Flagsmith. He talked about how Medusa started, why create a headless commerce solution, why make it open-source, and more. Medusa has risen quickly in popularity over the past months getting +9,000 starts on GitHub in only 6 months.