Month: January 2022

Posted on

Think before you code

‘Big upfront design’ has fallen out of favor in recent years, replaced by more Agile development approaches. However, before you start coding you have to have some idea of what it is you’re building.

Paraphrasing an online discussion, this is an all too true example experienced by many new developers when first starting out:

New Dev: I don’t know where to start with this app. It’s too big to comprehend and I just don’t know how to get started

Experienced Dev: Well, what is your approach for structuring the app, have you though about how to break the app down into different pages and what each page does?

New Dev: No, I haven’t thought about that yet, I just started coding and got stuck.

Think before you code. Even if it’s some rough notes of the key features of the app, or some sketches of the different pages and what the navigation looks like between the pages, any time spent thinking about what the app does, how it should work, and how it should be structured will always make the job of actually building the app easier.

Remember, the hard part of building any app is working out what it should do and how you should build it. The actual act of writing code is always the easiest part (or should be).

[Top tip series: rather than spending time writing lengthy articles over several days I’m going to try and post shorter, hopefully useful tips more frequently]

Posted on

Redux devtools stopped working: upgrading dexuv-devtools-extension

The Redux Devtools Chrome plugin stopped working for me, possibly after a Chrome update. I removed and re-installed the plugin and it still wasn’t working. It was opening up ok but not picking up any of my Redux actions or state changes.

Checking the docs, it seems there’s been a name change with how you integrate the devtools into you app too. Since I’m adding the thunk middleware I need to use the compose approach. Before updating and before this naming change, I was using this approach, described in a previous post here:

import { devToolsEnhancer } from 'redux-devtools-extension';
import rootReducer from '../reducers/reducer';

let store = createStore(rootReducer, compose(
    applyMiddleware(thunk),
    window.devToolsExtension ? window.devToolsExtension() : f => f
    )
);

New approach with updates react-devtools and the extension:

import { composeWithDevTools } from 'redux-devtools-extension';
import rootReducer from '../reducers/reducer';

const store = createStore(
    rootReducer,
    composeWithDevTools(
      applyMiddleware(thunk)
      // other store enhancers if any
    )
  );
Posted on

Take time to learn the basics

With the abundance of online tutorials, YouTube videos and everything else that’s easily available online, it’s never been easier to get started in software development. However, take time to learn the basics. Everything in tech is built upon something else. No, you don’t need to know or understand how everything works down to the bare metal, but if you’re getting starting building web apps, it does help to learn some basics like how to submit an HTML form.

[Top tip series: rather than spending time writing lengthy articles over several days I’m going to try and post shorter, hopefully useful tips more frequently]

Proudly powered by WordPress