Skip to content
OverviewSolutions
21
Comments
16
P

Hector Ramirez

@hectorlil48Chicago430 points

Hi, my name is Hector. I'm a Web Developer / WordPress developer. Looking to find any project I could help and learn with.

I’m currently learning...

I am currently getting better at JavaScript and React.

Latest solutions

  • Frontend Quiz App

    #react
    P
    Hector Ramirez•430
    Submitted 29 days ago

    While I’ve made significant progress on my quiz app, there are still a few areas where I’d appreciate some guidance to improve and refine my work:

    • State Management with Context API or Redux: As the app expands, managing state across multiple components is becoming more challenging. I would love help understanding the best practices for using Context API or Redux to streamline state management and avoid prop drilling.

    • Testing the Application: I haven’t yet written tests for my app, and I’m unsure where to start. I’d like help with setting up testing frameworks like Jest or React Testing Library and writing effective tests to ensure my app works as expected.

    • UI/UX Design Improvements: While the app is functional, the design could use some refinement. I would appreciate feedback on improving the user interface and user experience, such as making it more intuitive, visually appealing, and accessible.

    • Performance Optimization: As the app grows and becomes more complex, performance could become an issue. I’d like help identifying potential bottlenecks and optimizing the app for better speed and responsiveness.

    • Deployment Best Practices: Although I deployed my app on GitHub Pages, I’d like to learn more about other deployment strategies (e.g., Netlify, Vercel) and how to set up Continuous Integration/Continuous Deployment (CI/CD) for smoother project management.

    0 comments

  • Password generator app

    P
    Hector Ramirez•430
    Submitted 4 months ago

    I want to get more practicing using the Dom and writing functions. I'm getting better at CSS, but I still want to get practice on some of the input styles and animations.

    1 comment

  • Tip Calculator App

    P
    Hector Ramirez•430
    Submitted 5 months ago

    Need more practice solving problems with JavaScript. I intend to do more problem-solving.

    1 comment

  • Time tracking dashboard

    P
    Hector Ramirez•430
    Submitted 6 months ago

    How to plan out a project better. I feel like I don't know how to properly break down a project and find out where I need to start on it.

    1 comment

  • Newsletter sign-up form with success message

    P
    Hector Ramirez•430
    Submitted 7 months ago

    I feel pretty confident in my abilities so far. I just need more hands-on practice with CSS and Javascript.

    1 comment

  • Article Preview Component

    P
    Hector Ramirez•430
    Submitted 7 months ago

    I want to know if there is a better way to code this project. I think I did a good job but it could always be better.

    1 comment
View more solutions

Latest comments

  • P
    MikDra1•7,450
    @MikDra1Submitted about 1 month ago
    What are you most proud of, and what would you do differently next time?

    💻 Hello 👋 Frontend Mentor Community,

    This is my solution for the Frontend quiz app.

    • You should be able to:

    • Select a quiz subject

    • Select a single answer from each question from a choice of four

    • See if they have made a correct or incorrect choice when they submit an answer

    • Move on to the next question after seeing the question result

    • See a completed state with the score after the final question

    • Play again to choose another subject

    • View the optimal layout for the interface depending on their device's screen size

    • See hover and focus states for all interactive elements on the page

    • Navigate the entire app only using their keyboard

    • Change the app's theme between light and dark

    Additionally:

    • Your preferred theme will be saved so next time you visit my website you will get the right one.

    • Each category has different primary color so you can differentiate them.

    🛠️ Built with:

    1. HTML ✨
    2. CSS 🎨
    3. JavaScript 🧾
    4. React ⚛️
    5. Vite.js 💡
    6. Context API 🛒
    7. Styled-Components 💅
    8. React-Router 📡

    • Fully responsive design crafted with a desktop-first approach 💻

    • Enjoyed every moment coding this! 😎

    • Feedback is always welcome—let’s grow together! 🌱

    • Completed 15 out of 28 Intermediate Challenges so far—keeping up the momentum! 🔥

    • Completed 2 out of 12 Intermediate Premium Challenges 🔥

    • 👨‍💻 Join me on my coding journey as I tackle advanced challenges and add innovative touches to every project.

    • As I am developing in my journey with React I'm really looking forward to hearing your thoughts and suggestions! 💡

    Frontend quiz app built with REACT | VITE | JS - MikDra1

    #react#styled-components#vite#react-router
    1
    P
    Hector Ramirez•430
    @hectorlil48Posted 28 days ago

    Hey,

    I think you did a great job on your quiz app! It’s responsive, and everything works as expected.

    I was a little confused about how you styled it—did you do your own CSS? I really like that you used different colors for each topic, but for the HTML topic, the orange makes it a bit hard to tell if I got an answer wrong since it looks close to red.

    One thing I added to my own quiz app was local storage to save progress, so users don’t get sent back to the start menu if they refresh. I noticed you’re using useState, which works great, but it resets when the page reloads. Just something to consider if you ever want to add persistence!

    Overall, I learned a lot just by reading your code. What was your thought process when tackling a challenge like this? Keep up the great work!

    Marked as helpful
    1
  • P
    Hector Ramirez•430
    @hectorlil48Posted 4 months ago

    Hello Brian,

    Good work on making this with React. I want to redo it once I get to React. The design is nice, but it breaks when you view it on mobile. When you select the length to be 20, the password will be displayed on two lines. The strength bars are also changing before the password is generated. You should include validation for the length. Because it just does nothing, and the strength bars appear like there is a password it considers to be strong even though it has no length. Other than that, maybe add an animation for the COPIED word to disappear after a couple of seconds. Also, it shouldn't reset the fields after you copied it. I hope these help a little bit, I know I struggled to write the logic for mine, but it helped me become a better developer, and I hope I can help someone else with what I learned.

    0
  • Sandaruwan•510
    @Sandaruwan7056Submitted 6 months ago
    What specific areas of your project would you like help with?

    some tips or resources to increase my javascript skills will be helpful and if i made any errors in this particular challenge any tips to correct them will be greatly appreciated

    Tip Calculator

    1
    P
    Hector Ramirez•430
    @hectorlil48Posted 5 months ago

    You can improve the code by using event delegation to minimize the number of event listeners, enhance performance, and simplify the logic. Refactoring your error handling into reusable functions will also help eliminate redundant code. Using more descriptive variable names for clarity would be beneficial, like renaming Element to tipButton. Lastly, breaking down logic into smaller functions would make the code easier to maintain. Keep up the good work!

    Marked as helpful
    0
  • P
    Hector Ramirez•430
    @hectorlil48Posted 6 months ago

    Good job on the dashboard. It looks good in every size. The only thing I would say is on the card components; you might want to add a border radius to the top of the dark blue cards. Other than that, keep up the good work!

    0
  • جهاد أحمد•280
    @Gehad28Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    Using JS to validate the form and apply style for errors

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

    Any feedback is appreciated :)

    Sign up with success message

    1
    P
    Hector Ramirez•430
    @hectorlil48Posted 7 months ago

    You did a good job. I noticed that your image disappears when you reach your breakpoint. I recommend making the breakpoint larger and keeping it in the mobile design. I added a breakpoint at 1000px so that when it switches, it would look good without affecting the image. Also, when it's on desktop, you should add a min-width so it won't stretch with larger screens.

    Marked as helpful
    0
  • P
    Hector Ramirez•430
    @hectorlil48Posted 7 months ago

    Great work on this, but you may need to adjust the spacing. On desktop, there's too much space between the share div and the paragraph. Also, don't forget to change the border-radius on the image.

    Marked as helpful
    1
View more comments