Read on Twitter
I& #39;m creating a portfolio site as a place for freelance projects (and to extend my blog). I want to finish this time, so to make myself accountable I& #39;m going to track daily progress. As long as I do some meaningful work every day, I& #39;m happy. https://github.com/danspratling/portfolio">https://github.com/danspratl...
Day 1.
Project structured.
Frontend - Gatsby, Tailwind, some tests (cypress?) (not yet implemented)
Backend - json for now.
Barebones homepage created and design templates decided on. Need to work on homepage layout tomorrow and dummy content.
Project structured.
Frontend - Gatsby, Tailwind, some tests (cypress?) (not yet implemented)
Backend - json for now.
Barebones homepage created and design templates decided on. Need to work on homepage layout tomorrow and dummy content.
Day 2.
I& #39;ve created a general colour scheme (likely to change) and started to put together some layouts for my homepage. These will influence the rest of the site.
Not much to see yet, but it& #39;s surprising how nice it already feels. Total effort ~3h.
I& #39;ve created a general colour scheme (likely to change) and started to put together some layouts for my homepage. These will influence the rest of the site.
Not much to see yet, but it& #39;s surprising how nice it already feels. Total effort ~3h.
Day 3. Not much of a change today. Hit a roadblock where tailwindcss couldn& #39;t be customized in gatsby when using emotion. As i want to use classnames (which emotion doesn& #39;t seem to allow), i decided to switch to postcss.
2 hours to allow very rounded corners
https://abs.twimg.com/emoji/v2/... draggable="false" alt="😅" title="Smiling face with open mouth and cold sweat" aria-label="Emoji: Smiling face with open mouth and cold sweat">
2 hours to allow very rounded corners
" title="Day 3. Not much of a change today. Hit a roadblock where tailwindcss couldn& #39;t be customized in gatsby when using emotion. As i want to use classnames (which emotion doesn& #39;t seem to allow), i decided to switch to postcss.2 hours to allow very rounded corners https://abs.twimg.com/emoji/v2/... draggable="false" alt="😅" title="Smiling face with open mouth and cold sweat" aria-label="Emoji: Smiling face with open mouth and cold sweat">" class="img-responsive" style="max-width:100%;"/>
Day 4. Another quiet day as i& #39;m tired and didn& #39;t start till late. Managed to create a template for a form for my contact page, though i& #39;ll need to break this down into components and make it dynamic. Hopefully more progress tomorrow!
Day 5. No visual change today. Converted some of the contact form into input components to dry up my code. Got distracted by life admin and didn’t finish, so will finish up tomorrow.
Day 6. More work on the contact form today. Broke down the fields into 3 customisable components (text input, textarea, select) with validation. No submission yet. Will need to consider how validation works on select (outside of these components).
Day 7. Worked on the contact page a bit more. Tried a design I didn& #39;t like, so some wasted time there. Also spent some time trying to figure out the best way to manage state for the form validation but came up blank. Open to ideas if anyone has any?
Day 8. I worked on the useReducer approach to form validation but still not sure if it& #39;s right. My brain is fried and I just can& #39;t figure stuff out properly right now. Maybe tomorrow will be better.
So that& #39;s 3 days now without any real progress. Hopefully it& #39;ll pick up soon.
So that& #39;s 3 days now without any real progress. Hopefully it& #39;ll pick up soon.
Day 9. Too tired to code more today so instead researched form plugins, as per suggestions. The state was getting too complex around the validation so a plug-in makes sense.
React Hooks Forms looks like a good choice - simple, lightweight and performant. https://react-hook-form.com/ ">https://react-hook-form.com/">...
React Hooks Forms looks like a good choice - simple, lightweight and performant. https://react-hook-form.com/ ">https://react-hook-form.com/">...
Day 10. With a plan and feeling refreshed i& #39;ve rebuilt my contact form which is now much more flexible. With better error catching, and an updated design!
Day 11. Updated the portfolio section to be more interactive (and reusable). The portfolios now expand on hover (the images are temporary). Next I& #39;ll need to add content here to make it obvious it& #39;s a link.
Thanks for the inspiration @ellie_html
Thanks for the inspiration @ellie_html
Day 12. Just added some little white buttons at the bottom of my portfolio links to take you through to the full thing. Only a small change today.
Day 13. Skipped a couple days due to tiredness/sickness, but i& #39;m back up and running now!
Today I added a little social media component to allow people on my site to find me on here (and github).
Today I added a little social media component to allow people on my site to find me on here (and github).
Day 14. Updated the introduction section of the home page to make more appealing and direct the user. Also considering reworking my portfolio section to a new design. https://abs.twimg.com/emoji/v2/... draggable="false" alt="😅" title="Smiling face with open mouth and cold sweat" aria-label="Emoji: Smiling face with open mouth and cold sweat">
