Skip to content
OverviewSolutions
5
Comments
5

Abhijeet Singh

@geekyAbhijeetSrVaranasi, India70 points

Full-Stack Engineer | JavaScript | ReactJs | NodeJs | Express.js | MongoDB

Latest solutions

Latest comments

  • Bonk•50
    @giovanni-bandinelliSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    Well This is technically the first React project I dont drop after few days because I hate the framework so there is that (which is how I also discovered how a project goes into production lol)

    What challenges did you encounter, and how did you overcome them?

    Since I'm keeping all the challenges' codebases in a single GitHub repo I've been hosting all the HTML+CSS projects to GitHub Pages from the Main branch, React had been giving me problems so I decided to deploy the build (/dist/) to Vercel, a nice little discovery.

    What specific areas of your project would you like help with?

    I'm not satisfied with the responsiveness of the card on width from around 700 to 1100px, I've used max-width: clamp(90%, 60rem, 42%) on the preview card to try and set the width for both the mobile and desktop layouts so probably I should use different values there (although I don't know what, I know what each params means but I'm still bad at setting min and max values for stuff ;-; )

    Also I'm curious to know if I've "correctly" organized the code, I still used a single CSS file because I didnt feel the need to make them separate tbh but I should think about doing that in more complex projects, also I'll try a project that needs JS and use Typescript for that.

    Product Review Card in React

    #react#accessibility
    2
    Abhijeet Singh•70
    @geekyAbhijeetSrPosted 4 months ago

    ................................................................................................................................................................................................................................................................................................................................

    0
  • Abhijeet Singh•70
    @geekyAbhijeetSrPosted 4 months ago

    ................................................................................................................................................................................................................................................................

    0
  • Robbie Tambunting•150
    @rtambuntSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud that I set up the Vite + Tailwind project and knocked out the challenge efficiently. I implemented mobile-first design for a better user experience on different devices

    For these small projects, I think it's ok to leave out the README. But in the future for bigger projects, I would like to have a detailed and informative README

    What challenges did you encounter, and how did you overcome them?

    I encountered some Tailwind specific challenges:

    • Using Google Fonts with Tailwind:
    1. copy the link tag for the desired font in the .HTML file
    2. extend fontFamily in the tailwind.config.js file
    • Use ConvertAColor.com to convert the design file hsl values into hex for use with tailwind
    What specific areas of your project would you like help with?

    Are there any big differences between my solution and the design? If so, what specifically should I edit to fix it?

    React Tailwind Social Links Profile

    #react#tailwind-css
    1
    Abhijeet Singh•70
    @geekyAbhijeetSrPosted 4 months ago

    ................................................................................................................................

    0
  • P
    Xqgoji•120
    @JhinDanzoSubmitted 10 months ago
    What challenges did you encounter, and how did you overcome them?

    Responsive design, especially cropping picture

    What specific areas of your project would you like help with?

    nothing

    Blog card previw, html, css

    1
    Abhijeet Singh•70
    @geekyAbhijeetSrPosted 10 months ago

    Hey! Awesome work! Here are a couple of suggestions:

    • CSS Variables: Consider using CSS variables to store colors, font sizes, etc. This allows you to easily adjust styles across multiple elements.
    • Mobile-First Approach: Try tackling the layout with a mobile-first approach. It's generally easier to add complexity for larger screens than to remove it for smaller ones.
    Marked as helpful
    0
  • Abhijeet Singh•70
    @geekyAbhijeetSrPosted 10 months ago

    I can see in your code you are using media queries but truly you don't need any media queries for this design. I didn't read your whole code now but by looking at your design I can say that you need to add max width to your card component and try to solve it using mobile first approach.

    0