Building a personal website and portfolio
This website has been a long time coming. In grad school, my friends and I had tried to put together a blog. The point was to document the inscrutable errors we had encountered in the various tools we used for analysing behavioural and brain imaging data, and our solutions and hacks for them. We put together a bunch of content in a Google Doc. But life happened, and we never go around to converting it into a blog.
The idea
As I was working on various projects in my postdoc, I started to see that research studies have many different aspects. One person might be interested in the research results, another might want to know about the background literature and study development, and a third might be curious about the technical aspects like the statistical analyses. Additionally, during the pandemic, I realised that scientists have the responsibility to share not only scientific findings, but also the scientific process with the general public in a way that doesn't require them to have a PhD.
Over time, the idea of this blog evolved, and instead of focusing only on errors and problems, I decided to use it as a platform to share the process and the findings of my research.
Shift in mindset: From static to interactive
I have a lot of experience writing scientific articles and delivering talks to scientific and non-scientific audiences. But these are specific kinds of content delivery. Scientific articles need to be written in a certain kind of language, and be organised in a specific way. Talks offer the opportnity for interactivity, but you, as the speaker, can control how the audience's attention is directed.
A web app is a different kind of beast. You lose control over how the user is going to navigate the content, and have to use UX tricks to guide their attention based on their agenda.
At the same time, an advantage of a web app is that all the information need not be presented in one go. The reader can click around, hover, and interact with the content to opt-in to receive the information. This has been the hardest thing to embrace, and then leverage. It still doesn't come naturally. I start by putting all the content of an article on the page before figuring out what information can be hidden behind XXXX. Then it takes many iterations and rounds of feedback from Sid before a project is ready to meet the world.
Putting the projects together
This was arguably, the most important section of the website. In my vision for this section I had three main requirements:
๐๏ธ
Modular structure: Information about a project should be broken up into separate articles - each addressing a different aspect of the research - so that the reader can focus on the aspect that was most interesting to them.
๐ง๐ฝโ๐ฌ
Customisable information consumption: Each article describing a research project should have a technical version and a non-technical one. The reader should be able to choose how they want to consume the information. If you're a data-scientist without a ton of background about the cognitive neuroscience of memory, you can read the technical version of stats article, and the non-technical version of the study background.
๐ช๐ฝ
Flexible setup: It should be easy for me to add new and different kinds of projects in the future.
https://www.youtube.com/watch?v=qPsY4AKFlnM
My tech stack
Resources I found helpful when learning
Videos
- Quick introduction (10mins). Super basic.
- Good foundations - jargon-y(10mins)! Will probably become 30 mins when you pause and allow concepts to digest. ๐ค
- React basics. Liked it because he goes over building components, exporting, importing etc.
- Next JS basics. Great video. Goes over basics and a lot of background.
Articles and tutorials
- Overview of tech stack to use for portfolios
- Next JS website. Learn the building blocks step-by-step.