Do you know the best way to show your skills to employers or potential clients? Stand out from the crowd by presenting a well-digitalized flexible portfolio and get your dream job.
You’ll also learn how to work with Sanity. Sanity.io is the platform for structured content. It allows you to manage text, images, and other data using APIs.
Need the projects to put on this portfolio? Impress your employers with the NFT Marketplace and Filmpire – https://www.jsmastery.pro 🔥
⭐Sanity JSM Subscribers Special – https://www.sanity.io/javascriptmastery2022
⭐Sanity Content Platform – https://www.sanity.io
⭐Sanity Slack Channel https://slack.sanity.io
📙MUST HAVE PORTFOLIO GUIDE – https://resource.jsmasterypro.com/portfolio-guide
📚 Materials/References:
GitHub Code (give it a star ⭐): https://github.com/adrianhajdin/project_professional_portfolio
Sanity Schemas: https://minhaskamal.github.io/DownGit/#/home?url=https://github.com/adrianhajdin/project_professional_portfolio/tree/master/backend_sanity_portfolio/schemas
Styles & Other Code: https://gist.github.com/adrianhajdin/52b513f1d8a8189747595a587c3132e4
Assets: https://minhaskamal.github.io/DownGit/#/home?url=https://github.com/adrianhajdin/project_professional_portfolio/tree/master/src/assets
CSS BEM Methodology: https://www.devbridge.com/articles/implementing-clean-css-bem-method
In this video, you’ll learn #ReactJS Best Practices, file, and folder structure, the use of SCSS, #Animations using the most popular animation library – Framer Motion. And most importantly, you’ll learn how to use #Sanity. Sanity will allow us to dynamically manage the content of the entire application.
🌐 My personal recommendation for hosting services: https://www.hostinger.com/javascriptmastery
💻 Discord – https://discord.gg/n6EdbFJ
💻 Master JavaScript: https://www.completepathtojavascriptmastery.com/
Use the special promo code “YOUTUBE” on checkout to save $60!
❤️ Support JavaScript Mastery & Suggest Future Videos:
BuyMeACoffe: https://www.buymeacoffee.com/JSMastery
Patreon: https://www.patreon.com/javascriptmastery
🌎 Find Me Here:
Discord Group: https://discord.gg/n6EdbFJ
Instagram: https://instagram.com/javascriptmastery
Twitter: https://twitter.com/jsmasterypro
💼 Business Inquiries:
E-mail: contact@jsmasterypro.com
Time Stamps 👇
00:00:00 Intro
00:03:55 Backend Setup
00:21:23 File & Folder Structure
00:32:34 Navbar
01:05:18 Header Section
01:32:29 About Section
01:43:53 Sanity & React
01:56:19 Higher-Order Components
02:09:37 Work Section
02:42:52 Skills Section
03:24:38 Testimonial Section
03:50:57 Contact Section
04:18:25 Deployment
source
31:45 import './App.scss'; doesn't work neither does it show any error. Been stuck on this for hours.
Also you can face some problems (especially with skills section and with ReactTooltip) only because FKN REACT 18 AND GODDAMMIT STRICT MODE!!! Just don't use it and everything will be much easier 🧙♂
03:09:56 – after that second map i got same error again ( Cannot read properties of undefined (reading 'map') ), but checking if array exist helps to fix it. Maybe it will save your time if you have same error 🙂
I like your ear-catching introductory words,
Hey! I was following along with your tutorial but for some reason my Sanity just wouldn't connect with my project. Any fixes for this?
Thanks a million, times, brother! This boosted my confidence with my personal portfolio and that too with react. thanks again
I want to ask you is how can we host the backend part of it , because every time I want to open I need to run that command again and again in VSCode , so is there any way to host the backend also ??
Made it through the end. Thank you, kind sir!
Wow, that's the best portfolio that I ever seen, that's very nice but where is the source code of this site ?
Wow, that's the best portfolio that I ever seen, that's very nice but where is the source code of this site ?
Hello. Somebody knows about this error during the setup? ✖ Resolving dependenciesetching packages
✖ An unexpected error occurred: "C:\Users\usuario\AppData\Local\Yarn\Cache\v6\npm-wrap-ansi-2.1.0-d8fc3d284dd05794fe84973caecdd1cf824fdd85-integrity\node_modules\wrap-ansi\.yarn-metadata.json: Unexpected token u0000 in JSON at position 0".
✖ Resolving dependenciesetching packages
Excellent tutorial. Please do a tutorial using framer motion! Thank you very much
everything runs only on the PC. When testing Android, the input from sanity does not work
Please need help
I got a problem during installing sanity.js with windows 10. It said that the script cannot be ran. How to solve this problem?
Beautiful project, beautifully told 🙂 Thank you, JSM!
very nice, but i don't understand why you still use create.root in index city render.root.
It's not that cool because then the current version of React is not displayed, but the 17th version.
it's better like this
import React from 'react';
import { createRoot } from "react-dom/client";
import App from './App';
import './index.css';
const container = document.getElementById("root");
const root = createRoot(container);
root.render(<App />);
Please make Beautiful portfolio React js and tailwindcss ….Your teaching style is best
"I just want to say how amazing Sanity is and I am saying this because I was paid to. But it is pretty awesome." ~this video most likely.
How to create those unique png logos?
Thank You🤩🌪
Bless your heart.
i got a bunch of errors trying to install all the @saniity etc
I cannot believe that someone can be this generous. I learn so much. Thanks
I got this error in Testimonial when i add src to img :
The provided `src` attribute is an unsupported type ImageUrlBuilder. This value must be coerced to a string before before using it here
Next can you please do a blog application with Sanity?
I am about halfway through the video and for some reason the about section sanity data is not appearing on the page. If ran into this problem and solved it please let me know! : ) That aside this is a great video and tutorial. Thank you so much!
2 :02 to 2:09 hours I'm getting this warning and my screen is blank totally:- "Anchors must have content and the content must be accessible by a screen reader" .. can anyone help?
Sanity coupon code is not working. Throwing some errors. I'm not able to follow the course. Can you please help me?
Many thanks ❤
I am unable to fetch my data from sanity
quick question, is there a way to organize the portfolio section after adding different projects? In sanity I dont see how to organize when everything appears when the filter is set to 'All'.
Hey, i've just ended higher components part and mine don't slide.. am i missing something here? Btw, thank you so much for this tutorial! It's being great so far!
after 00:21:23 I get 66 vulnerabilities (14 low, 26 moderate, 25 high, 1 critical). Perhaps maybe try explaining what to do in case something goes wrong? 😅
I think ReactDOM.render is not a thing anymore (found the error message when did the setup). Instead I used
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);
yes, please do the animations tutorial video using framer motion
This is a very detailed course that I have never seen before. U make me humble in dumb amazement. I do really thank u for your great video letting me get more proficient on website design.
I'll ask for help through here since on stack overflow no one gave a helpful answer. I have an error that says a dataset must be provided when trying to fetch data from the Sanity backend. Can someone help on this?
Outstanding! Great job!
I have followed the tutorial. The app is working and deployed, and I am now going to modify it to make my own version. Thank you!
link BEM css – Error
How to write AppWrap by TypeScript and how to using that AppWrap in other components? I was trying so hard, can't fix it.
My friend, can you help me, I have a problem while installing sanity
Sir i like your vs code theme i want to know which theme are you using? And your videos are too amazing.
I would like so start by thanking you for the most comprehensive tutorials on this subject out there. I am a big fac an obviously an even greater noob :). Could you tell me why my App.scss is not showing any changes and should I use watch sass button (that creates a bunch of CSS files)? thank you and keep it up
If you can't see any Sanity data in your About section: make sure you enable CORS for your local address in the Sanity dashboard. On my computer the connection to Sanity CDN was being blocked in the browser when loading the page.