Updating choir app choros.ie

Поделиться
HTML-код
  • Опубликовано: 19 окт 2024
  • How I update my choir app with the weekend's songs for Mass.
    1. The setlist comes in on the choir's WhatsApp group.
    2. I spin up a development server in a searchable version of my app. Written in native React, with TailwindCSS styles, and a Vite scaffold which gives the project structure and the CLI commands to run it.
    3. I enter Search mode and load up the songs to the front page by partials earch on either Title OR First Line. This was a requirement right from the start, as before the app, the choir would have to sift through mountains of paper photocopies which really needed to be double-indexed. Plus the paper photocopies in the folders rustled a lot on the mics and were bulky to bring to every Mass. Now, some months on and very confident using the app, singers just bring their phones or tablets.
    4. Horrible hack this, to get data between the development and the production versions of the app, I copy the last item of React state in React dev tools.
    5. I open up the production app, paste the JSON into a JS file called hardcoded-songs.js (VS Code handles JSON - to JS conversions automatically), and spin up a build process on the app.
    6. It has saved the tiny production directory (under 300k with fonts and graphics) and I manually add a file called _redirects (NO extension). It's purpose is to make the app's routing run smoothly when on a Netlify server.
    7. I log in to my Netlify account on a browser, and drag and drop the /dist directory production deploy. Published.
    8. Important step this - I test on a device. There are ways of simulating devices more accurately than Chrome developer tools, which are notoriously sloppy. These methods belong to a class of testing called HTTP Tunnelling and I talk about it in my book.

Комментарии •