Resetting a GitHub Personal Access Token on MacOS

Personal Access Token’s are used to grant access to one of your repos with specific permissions. They have an expiry, so when one expires you need to recreate a new one, details are here.

If you’re trying to push and your token has expired, you’ll see an error like this:

> git push
remote: Invalid username or password.
fatal: Authentication failed for 'https://github.com/youraccount/yourrepo

The first time accessing a repo requiring authentication is simpler because it will prompt you for your id and password (or token). Once you’ve set one up though, it’s not as obvious how to reset a new token value, since the git cli only gives you the above error, it doesn’t prompt you to enter a new password/token.

To replace your cached credentials, use these steps (from here):

git config --global --unset credential.helper

git credential-osxkeychain erase
host=github.com
protocol=https

Press Return twice on the second step. Close your Terminal, open a new one, then:

git config --global user.name "userid"
git config --global user.email you@example.com

From your GitHub account, go to Settings from the top right icon, then Developer Settings, then Personal Access Tokens.

Next time you do a push, use the Personal Access Token value when prompted for your password.

Fix the problems you have, not what you don’t have

It’s easy for new developers to get caught up spending time on things that really don’t matter. Spending time trying to work out whether approach A is using more or less memory than approach B is a common distraction, and usually the answer to whether it does or not is irrelevant (why would you be concerned if memory for a variable is stored on the heap or the stack, and try to do do ‘weird things’ to reduce memory usage).

It’s important to know if you have a problem or not, and then spend time investigating and resolving that specific problem. Don’t spend time worrying about things that are not important or irrelevant. Knowing what is important often comes with experience, but if you’re unsure then ask one of your more experienced collegues.

[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]

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]

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
    )
  );