Open trainfarb opened 1 year ago
Dediced to create this in the same directory of the app that already exists. These are the presets that I used. Taking note because they weren't in the video tutorial that I'm watching
Kept getting an error when trying to run. Saw something that said node was outdated and still couldn't upgrade. Think this is the solution: https://youtu.be/Ue6g4udgbdI
This worked!!! Only took me 45 minutes to get to this point (yikes)
DOCUMENTATION: Ensure people install the latest version of node from the website before they try to create a next.js site with our process
Loom Video after first hour of work: https://www.loom.com/share/e89c18ec9abe47f6a888985b924839ee?sid=9027687b-2462-4eaa-bd91-c738d12cfc35
Took me 45 minutes to work through all of the issues. Then, the default functions of what I was working with didn't align with the video. I'm no pro in javascript, react, or next, so I found a tutorial from a month ago that I'll work on in the next pass.
This video decided to use ESLint, so deleting files to start over to follow this.
This is using Sanity.io which I don't want. I want everything to be in one place. Going back to original video now that I've seen how much he's stripped away the original file.
Just added header and footer with this tutorial and realizing the fonts aren't working, so I'll be looking up a way to resolve the conflict that's being shown in the app.
This resolved all errors: https://stackoverflow.com/questions/69238794/cannot-find-module-next-or-its-corresponding-type-declarations
After resolving that issue, fonts still weren't loading. Found another articles to help with what I think the issue is. https://www.codeconcisely.com/posts/tailwind-css-unknown-at-rules/
LOOM After 2nd hour of work: https://www.loom.com/share/348d4659c7e94136abe6b352b83712f9?sid=bd1b4af3-fcd3-42b9-a987-019e53366e62
Switched back and forth until landing on the tutorial that will allow for markdown. Had some issues with error messages and fonts not loading. General error messages got resolves (above), but still need to work on the font size issue in the next go around. Soon enough I'll
After 2 hours...I'm 9:11 into the video
And this is what the app looks like lolz...
I missed coding and am enjoying this battle...looking forward to getting over the hump so the rest of the video can go smooth.
https://www.codeconcisely.com/posts/tailwind-css-unknown-at-rules/ This cleared up the at warning, but still wasn't seeing the fonts rendering properly
By randomly commenting out the import.global.css, the proper text styles started loading. I think this will get flushed out when the tutorial starts styling
time to keep going
LOOM After 3rd hour of work: https://www.loom.com/share/564b261c0a9942679d945252eecffa78?sid=2ef8635a-7374-43dc-a9a9-10d020dff32d
Got to 23:00 into the tutorial. Making good progress now. Here's what the app looks like now:
Home Page
Post Page
Good to move onto hour 4
LOOM After 4th Hour of Work: https://www.loom.com/share/cc8b68fb69f3466c9989e5f2722b92c3?sid=694f32a1-7f4d-4e43-8857-b9ded23618d7
Got to 46:00 in the video. Styled the homepage with tailwind.css. Here's how it looks now:
LOOM After 5th Hour of Work: https://www.loom.com/share/8231ee49ec8f466890f9c3a4931fe555?sid=50999090-d641-4496-9961-d7e6478dd0bd
I got through the design of each page. Ran into two errors that I worked through. One was from the html syntax that I had in b09onboarding from the Jekyll site. I took that page out to resolve and will add back in on the next pass in plain markdown for simplicity. Also, the images weren't loading at first, but I noticed I just placed them in the wrong folder.
Here's how the site looks now. This matches what's in the tutorial.
Here's a post page:
I'll obviously want to change the design quite a bit, but this is great for the initial version for onboarding.
About to start 6th hour. This will be dedicated to going through each of the posts to get clear on what I want the final product to be for people who are onboarding. This will be the first iteration of the portfolioWallet (Web5 Wallet for GitHub) that a person creates for their platform ecosystem.
LOOM Video after 6th hour: https://www.loom.com/share/d8dcd673cd3f41ce9e230c668ad252d3?sid=d5606d6a-57fe-46b8-8d9f-05140e852804
How page looks after completing this session: https://github.com/ourStoryNetwork/lp09-onboarding-platform/assets/8133349/24c683d7-d819-4205-ab2f-d7c88901d770
About to start 7th hour. Complete 09onboarding and walk through each of the rest as an introduction to each of the repositories that'll be created.
LOOM Video after 7th hour: https://www.loom.com/share/15b4b8a5cb454a099073ad310422e725?sid=86a946c0-a3bd-4932-b3dc-4fe0d78c4a14
Today's focus will be on wrapping up the initial release of the 0.9 OnboardingPi Portfolio with Next.js. I want this to look really good, so I'll be bringing in designs from TailwindUI.
Last week, I was turning a lot of this into documentation, but all of that is meant for the project wiki. I will maintain focus on presenting the final responses for each beat rather than explaining all of the steps. We have each of these platforms for a reason.
I found this video and am switching from the markdown structure to my own page structure: https://youtu.be/zbYBgy_ChGY
Doing this so I can more easily take advantage of the Tailwind UI free templates.
LOOM Video after 8th hour: https://www.loom.com/share/bd9c47c4baaa4ef9a55ee34c7bd9ed04?sid=75f2ddb5-980c-41c2-b50c-ba02a22ca59b
LOOM Video after 9th hour: https://www.loom.com/share/bd9c47c4baaa4ef9a55ee34c7bd9ed04?sid=b98d59e9-8838-4578-addb-3f588118f423
LOOM Video after 10th hour: https://www.loom.com/share/ba2e07afd3604e3793d615259defae3a?sid=4b059b2c-dce3-4756-b46a-065176624ce4
LOOM Video after 11th hour: https://www.loom.com/share/e6666098568941c6baf8ce3068d0d704?sid=dc429cee-f39d-412b-ac8a-8ccf2184b822
LOOM Video after 12th hour: https://www.loom.com/share/45a69f2035cf4cc9b78dbd48fc6b0e24?sid=ecc1eece-c7f2-4607-b4ae-4628ca8b53d6
LOOM Video after 13th hour: https://www.loom.com/share/71ef867ba1914efeb8aae01cab7d9a33?sid=c890b978-4948-4f4b-b112-41786c681a26
LOOM Video after 14th hour: https://www.loom.com/share/8aa59132bfbb4e738cb347dfbc01285d?sid=713646ad-632f-4ff3-9c5f-a4ad94721ead
LOOM Video after 15th hour: https://www.loom.com/share/3427b74c441640fda2e0afc624339c35?sid=84305844-3124-4a47-a07c-835564effda9
LOOM Video after 16th hour: https://www.loom.com/share/a7415588e0ed4482a8f8cb5e6e19b234?sid=58708b1d-aa6a-414f-80d6-f0815ed0c9e1
LOOM Video after 17th hour: https://www.loom.com/share/65c0e7b74ffe45d4853f1be878847225?sid=3a33fcb1-639f-444a-8973-2d2002fc1285
LOOM Video after 17th hour: https://www.loom.com/share/4a3e7549759a47a296683dcfcf6a7fbc?sid=c612d8c9-fd13-4e29-9f53-7ee91a76ad17
0.9/9.0 YOU: 0.9 OnboardingPi by oS3, ourStory, hu3agency, ep0_daoTeaching, trainfarb
1.8 NEED: Jekyll was good for me to spin up my initial idea, but it's outdated and there's not much more I can do with the framework as the project evolves.
8.1 GO: https://youtu.be/uXFbi9Nqzc8: Was avoiding Next.js because I assumed Jekyll was easier, but after watching this video it was clear that this was the way to go
2.7 SEARCH: Looked up some different tutorials and websites for templates:
7.2 FIND: https://youtu.be/Hiabp1GY8fA: landed on this because it lets me use markdown which is what I wanted from Jekyll, but also is customizable with html and css which I'm really good at from designing nOrm's frontend
3.6 TAKE:
4.5 RETURN:
5.4 CHANGED: