For the last few months, I've been working on a personal portfolio. I've always believed that a separate portfolio is important for any dev since i...
For further actions, you may consider blocking this person and/or reporting abuse
Whenever I see someone else's portfolio it makes me want to completely change my own. Looks really good man, and interesting to see your process
You should actually redesign your portfolio
Thank you so much! πβ€
In your CSS file, you can add the following to remove the X-axis scroll bar that appears at the bottom of your blog page:
body
{
overflow-x: hidden;
}
Thanks for noticing! π Fixed it π
@madza As a homework, I think you should try changing the y-axis scroll bar colour in the blog page into one that meets the theme of your website.
Good point π
At one time during dev I actually styled them the way you described, but I switched back to classic style as they were pretty hard to notice ππ
You can still find them used in this post, for example, where I use them as X-axis scrolls for code snippets.
I just commented them out for the main Y-axis, the code is still there and I might use it again if I change my mind ππ
@ShadowNinja just deployed the custom Y-axis scrolls, so you could take a look π Curious, do you think they look better like this? π
Definitely looks better but it needs to be more lighter; I could barely tell its there.
Isn't there any way to make it lighter?
Yeah, that was the initial reason I switched back. π But I will take your advice and try to experiment with some lighter shades like #576180 from my color palette described in this post π¨
Thanks a lot for the input, helped a lot ππ
u have done a great works.
if u need my help. i will with my pleasure.
send me mail at anytime.
Thanks for the support ππ
Ok. I like contact with talent developer.
Best regards.
If any problem occured, I will send u a request.
Means a lot, thanks! ππ―
Stunning.. ππ»
Thank you so much, mate! ππ
It's awesome. Some great effort there. Btw I have a question. How can that scrollable list be achieved? like you've done with your music section? It's like a fixed container but it has got items scrolling in it.
Thanks for the kind words! π
The trick for the scrollbar to appear for fixed divs is first set the specific
height
or you can also usemax-height
if you don't want to show empty space in case of fewer items. And then useoverflow-y: scroll
to display scroll when the content exceeds the height of the containing div. πThanks for this. I've been struggling to get it work since a few days. Really appreciate it.π
No worries, happy to help! πβ€
Looks clean. Biggest critique I have is that I think you should make your projects more easily visible. It was jaring to get to your home page, try scrolling to see more, have it not work, then have to search the UI for where I could see your work. Maybe just put that page of projects additionally at the bottom of your main page. Also I'd suggest adding more visual distinction between your projects. The only difference is their text, which requires reading each one to distingush them. Maybe add a bit of a picture to each one, either a picture of the project or some releated image off of unsplash.
Looks good!
Thanks for the valuable feedback! π
During development, I had the same thought to make a landing page scrollable, where I would present just 3-4 highlights for each section and then add 'view more' that would open the respective section with all the content. That's a nice point, as most of the portfolios are like that.
About the project's images. At one point in the development, I had listed the projects as a title and image. It was really easy to tell right away what each project looks like and what it's about (especially since most of the visuals were GIFs). But I went with the text and description as it's the main theme throughout the whole portfolio. Same for the Blog articles not showing preview images.
I still have the code for that, so I might switch back to that in the future.
Thank you for sharing this. Iβm working on my own first portfolio and the ones Iβve seen so far are beautiful but waaaaaaaay over my skill level at this point. Yours is concisely and relatable for a beginner like me.
Awesome to hear! πβ€
That was the goal to create something simple and easy to use π
Loved your site. Congratulations π
Just wanted to ask, disabling open in a new tab feature say using ctrl + click or using the mouse wheel was intentional?
Thanks a lot! ππ
Just tested on navigation items, markdown links, and images. Ctrl + click works as expected opening in a new tab. I'm on Chrome v89, what browser do you use and which link do you specifically try to open? π
Both the blog posts and the links in the project section won't open using the mouse wheel. Also, the blog posts don't show the open in new tab when right-clicked.
The navigation items are perfect π
I am using Edge Chromium v89
Thanks for the notice! π
Tbh, I've never used a mouse wheel to open in a new tab, that's why never tested against it. I use next/link and the absence of 'open in new tab' is most likely caused due to links being dynamically generated (in case of blogs and projects) π
I will see what I can do with this when I will have some free time π
Glad to help you π
After reading this post, no wonder you are missing for so long. At last, you finally replacing the incomplete portfolio website! Now the website looks great and resourceful. I just get know that you are producing EDM music. I stopped making music 7 years ago, my SoundCloud profile.
Yeah, been working on this for the last months π Thank you for your kind words, means a lot! ππ
Just listened to your tracks on SC, great job. π― Didn't know you produced music as well π Trance and progressive were the first genres for me, too ππ΅πΆ
Your site looks great! I like the clean look and easy to use interface. It might be helpful to have thumbnail images on your project/article cards, to help visualize what the project/article might be about.
Great work!
At one time during the dev process I used them, tho switched back to text and description cause it fitted the overall theme of the portfolio better. I might switch back again, since other devs recommended that as well π
Thanks a lot for the kind words! ππ
Love it, it's clean, slick and professional ... the dark mode is a winner, really makes the site stand out and is pleasant on the eye ... and the animations are well done, convincing and very good-looking, you don't often see animations utilized that well ... congrats, great job!
Thank you so much for the kind words! πβ€
Well played @madza π₯³
The Framer Motion is a nice touch π
Thanks! ππ As far as I've tried it I really liked it, seems like a powerful library πͺ
i think you meant to use the sentence
quick brown fox jumps over the lazy dog
with all the alphabets. current one misses some letters (h, s, t).Hahah, good eye π¦πΆππ
Agree. The design has always been based on personal preferences π
Personally, I'm pretty happy with the color scheme, tho I know that the light mode switch would be pretty much mandatory when it comes to designs this dark. π¨
Also, I'm aware there is a lot to improve performance-wise, especially when opening separate articles or projects in their own respective pages. Thanks for the input, def on the list to work on in the future π
Hi there , My name is Azeem and Recently I started working as a react developer. Usually we get front end designed by some other guy in the company but In my case. I am similar to you. I am trying to create my portfolio and a blog where I can write content everyday. But you know I am really struggling on the planing part as I am not very creative at creating new content from scratch. Can you give me some pointers and tips.
The irony is - it's also the most important part. π
I've always thought that the best source for new ideas is to consume quality information every day. Make it a habit to read blogs like DEV, Hashnode, and Medium. Focus on the devs that provide quality over quantity. Our thought processes and ideas are largely defined by the information we consume, it's just sometimes we are not fully aware of it. π‘
Congrats!
Thanks a lot ππ
Hey, well done for the portfolio!
Just a question, what did you use to make the photos of the planning part?
Thanks for the support! ππ
I use Figma, an awesome and powerful tool for designing and wireframing ππ
Your dynamic lists are awesome!
Thanks a lot! ππ
I'm still experimenting with markdown highlighting colors, to be honest π
I might swap the colors once I write an article that holds multiple level headings, with something that fits better π¨ Thanks a lot ππ
Nice Portfolio man
Thanks a lot! ππ
Finally an inspiration to start mine :)
Awesome to hear! π Good luck ππ±
Vercel is kinda like Netlify ?
Both are serverless deployment platforms for web applications. Both are awesome for frontend/static stuff, plus Vercel excels on the backend as well. π Plus I like their UI better π
Hey! That's awesome :)
Great to hear! Thanks πβ€
Iβm in love with your portfolio. It looks so simple yet so beautiful. π₯β€οΈπ₯°
Thank you so much, means a lot πβ€
Congrats, Mazda and thanks for sharing!
I didn't know about some of the things you used there, can you tell us about the pricing? You got that site running for free?
Cheers!
Thank you so much! ππ
Since it is deployed on Vercel I don't have to pay anything to run the site. The only pay (yearly) is for the custom domain I use. π
Nice work, the portfolio looks great especially the part where you showcase your previous works. You have a nice color scheme in place too.
Thanks a lot! πβ€
Hey man, this is a beautiful design, I get many ideias after read your post :)
Awesome to hear! π Thanks a lot! πβ€
Awesome
Thank you so much! πβ€
Nice job !
Thanks a lot! πβ€
Loved it, congrats to you π₯³
Awesome to hear! Thanks πβ€
Congrats! Looks incredible! Also loving the musicππ» Keep up the great work!
Awesome to hear that! ππ
Thanks for taking a listen πΆπ΅
So cool!
Thanks a lot! ππ
It looks very nice not tough and as for me pretty clean. Congrats! π
Thank you so much! ππ
Nicee π congrats
Thanks a lot! ππ
Gran trabajo. Γxito.
Thank you, I guess?! ππ
This is cool !
Psss... Live demo links are missing on project pages.
Yup, I know I should add them once the project is opened, currently, there are just GitHub links π
Looks amazing, good job
Thanks a lot for the feedback! ππ
Well that's a fun portfolio! Just loved that onload animation π₯³
Thanks a lot! ππ That's Framer Motion doing all the work π Plus with the help of Nprogress for load progress, I think it worked well π
I am hearing a lot about Framer motion these days. Might be the good time to try it now π
Absolutely, the best way to learn anything tech is to pick it up and experiment with it to see what works for you and what do you like. π¦π¨
Great work, Madza. I like it. Simple and effective. That's how it should be!
Thanks for the kind words! ππ
The main blocks are there, tho still a lot to improve! π
Nice work
Thanks, means so much ππ
looks awesome tbh, I would probably copy your design for my own portfolio ππ