teklinks

tech/webdev magazine

André Simões

André Simões
Web Developer

August 29, 2019

Good Practices for Testing React Apps

Thursday, August 29, 2019 Teklinks

Alright, hot off the heels from reading GOOS, I have some insights on creating testable React apps. First and foremost, start every feature with an end-to-end test. An end-to-end test is basically a test from the user’s perspective (click here, wait, confirm this text is displayed, etc.

Full article

Release management in Angular with Lerna

Thursday, August 29, 2019 Teklinks

Scenario: We need to release component libraries to npm because we want to consume them inside our Angular applications. We want to be able to release the components independently. Furthermore, we have some dependencies between the libraries.

Full article

How to write great React

Thursday, August 29, 2019 Teklinks

Writing this article started with a question: if I could give a new developer one piece of advice to help them write great React, what would it be? My answer: write clean components by following the rules of writing clean functions.

Full article

August 28, 2019

Thinking About React, Atomically ⚛

Wednesday, August 28, 2019 Teklinks

If you’re not familiar with Brad Frost’s Atomic Design principles, stop right now and go read about it on his blog or buy his book. It’s a fantastic design system that, when implemented correctly, can cause the elements of your application’s user interface to stitch together beautifully and simply.

Full article

Software Testing Anti-patterns · Codepipes Blog

Wednesday, August 28, 2019 Teklinks

There are several articles out there that talk about testing anti-patterns in the software development process. Most of them however deal with the low level details of the programming code, and almost always they focus on a specific technology or programming language.

Full article

August 26, 2019

13 Tips to Write Faster, Better-Optimized JavaScript

Monday, August 26, 2019 Teklinks

10 years ago, Amazon shared that every 100ms of latency cost them 1% in sales revenue: across an entire year, 1 second of added load time would cost the company in the region of $1.6 billion. Similarly, Google found that an extra 500ms seconds in search page generation time reduced their traffic by 20%, slicing a fifth off their potential ad revenue.

Full article

The End of Agile

Monday, August 26, 2019 Teklinks

I knew the end of Agile was coming when we started using hockey sticks. Every morning, at precisely eight o'clock, the team of developers and architects would stand around a room paneled in white boards and would begin passing around a toy hockey stick.

Full article

August 21, 2019

When to useMemo and useCallback

Wednesday, August 21, 2019 Teklinks

Performance optimizations ALWAYS come with a cost but do NOT always come with a benefit. Let's talk about the costs and benefits of useMemo and useCallback. Now I want to ask you a question and I want you to think hard about it before moving forward.

Full article

MVWTF: Demystifying Architecture Patterns

Wednesday, August 21, 2019 Teklinks

Originally published on Android Essence. This can be really intimidating to new Android devs, as well as seasoned veterans who are constantly questioning if they're using the right one.

Full article

A better Git workflow with rebase

Wednesday, August 21, 2019 Teklinks

On this "Coding Tip of the Day" I'll show you a different way of approaching git branching/merging with rebase. My team at Amazon adopted the workflow you'll see in the video and we love it. Whether you're mostly a solo developer or on a large team, give this a shot, I guarantee that even if you don

Full article

August 18, 2019

Better Code Reviews

Sunday, August 18, 2019 Teklinks

Reviewing code is an daily occurrence for developers. It can be a humbling learning experience, but it can also turn into an egocentric process. Over the last few years I’ve learned some best practices, either through personal experience or excellent advice from peers, that have helped me to become a more effective and empathetic reviewer.

Full article

Handling Unused CSS In Sass To Improve Performance

Sunday, August 18, 2019 Teklinks

In modern front-end development, developers should aim to write CSS which is scalable and maintainable. Otherwise, they risk losing control over specifics such as the cascade and selector specificity as the codebase grows and more developers contribute. One way this can be achieved is through the use of methodologies such as Object-Oriented CSS (OOCSS), which rather than organizing CSS around page context, encourages separating structure (grid systems, spacing, widths, etc.) from decoration (fonts, brand, colors, etc.).

Full article

August 15, 2019

Working with Numbers in JavaScript

Thursday, August 15, 2019 Teklinks

Numbers and mathematics come into most scripts at some point, be it in the form of the simple arithmetic required to add up prices and work out sales tax, the process of generating and using random…

Full article

ReactJS error boundary + Sentry

Thursday, August 15, 2019 Teklinks

Thinking and building in React involves approaching application design in chunks, or components. Every part of your application that performs an action should be treated as a component.

Full article

August 13, 2019

Optimizing React Components with Error Boundaries

Tuesday, August 13, 2019 Teklinks

Disclaimer: The concept discussed in this article is part of the advanced concepts of React as outlined in the official docs. But I see it as something every react developer should know and use. You would find this my view to be accurate at the end of this tutorial.

Full article

How to handle forms with just React

Tuesday, August 13, 2019 Teklinks

Ok, the title of this article is a bait. I’m actually going to tell you about how forms can be handled with… Javascript. And react is just going to help us stay declarative. That’s what it’s for, after all.

Full article

Write tests. Not too many. Mostly integration.

Tuesday, August 13, 2019 Teklinks

Yes, for most projects you should write automated tests. You should if you value your time anyway. Much better to catch a bug locally from the tests than getting a call at 2:00 in the morning and fix it then. Often I find myself saving time when I put time in to write tests. It may or may not take longer to implement what I'm building, but I (and others) will almost definitely save time maintaining it.

Full article

August 11, 2019

Native Lazy-Loading Launched on Chrome 76!

Sunday, August 11, 2019 Teklinks

I woke up to this amazing news this morning and couldn't think of anything better than to share with you. Given that I'm a big fan of performance optimizations, and the fact that I had written about lazy loading components with the native Intersection Observer API, it is only right that this update is brought to you.

Full article

Testing Implementation Details

Sunday, August 11, 2019 Teklinks

Testing implementation details is a recipe for disaster. Why is that? And what does it even mean? Last year when I was using enzyme (like everyone else at the time), I stepped carefully around certain APIs in enzyme.

Full article

What's New in React v16.9

Sunday, August 11, 2019 Teklinks

I was starting to get a bit worried. The last few minor point releases of React had come out months apart and we were already into Q3 without a new release. My fears have been quelled though as React v16.9 is finally here with a few new features, bug fixes and deprecations!

Full article

August 10, 2019

22 Miraculous Tools for React Developers in 2019

Saturday, August 10, 2019 Teklinks

React, as we know it, is a JavaScript library to build amazing user interfaces. But not everybody is using the same tools or know all of the great ones out there that help make the react development experience funner and more proactive.

Full article

Environments in Create React App

Saturday, August 10, 2019 Teklinks

While developing your frontend React app and working with an API backend, you’ll often need to create multiple environments to work with. For example, you might have an environment called dev that might be connected to the dev stage of your serverless backend.

Full article

How to Crop Videos

Saturday, August 10, 2019 Teklinks

During a recent episode of the Script and Style podcast, I had noticed that the video recording had showed a bit of our internal chat that wasn't necessary for our viewers to see.

Full article

August 8, 2019

I Used The Web For A Day On A 50 MB Budget

Thursday, August 08, 2019 Teklinks

Many of us are lucky enough to be on mobile plans which allow several gigabytes of data transfer per month. Failing that, we are usually able to connect to home or public WiFi networks that are on fast broadband connections and have effectively unlimited data.

Full article

How to add Sentry with source maps to a React app

Thursday, August 08, 2019 Teklinks

In this tutorial we are going to configure Sentry with source maps for a React app created with create-react-app. The app we are going to use in this tutorial will contain a form with an input and a submit button. When the form is submitted with some text, it throws an error.

Full article

August 6, 2019

Linting and Formatting with ESLint in VS Code

Tuesday, August 06, 2019 Teklinks

Tooling for JavaScript is too good to not take advantage of, especially when paired with Visual Studio Code! In a recent article, I posted about Code Formatting with Prettier in Visual Studio Code to help you automatically format your code. ESLint can do that and more!

Full article

CRUD with Azure Serverless Functions

Tuesday, August 06, 2019 Teklinks

Serverless functions are lowering the barrier to backend entry for frontend and beginner developers. Personally, I have a huge relief that I don’t have to teach beginner developers DevOps topics — scaling, gateways, containers, hell no. I don’t even know these things myself.

Full article

August 5, 2019

Component Story Format

Monday, August 05, 2019 Teklinks

Imagine if developing a component in Storybook automatically unlocked the ability to test it with Jest, import it in Sketch designs, paste it into InVision prototypes, and visually test it in Chromatic. What if your component library was universally accessible inside all your favorite tools?

Full article