Skip to content
OverviewSolutions
14
Comments
12

Oswaldo Castro

@tufcoderSão Paulo, Brazil240 points

Web Developer and self taught apprentice.

Latest solutions

View more solutions

Latest comments

  • Oswaldo Castro•240
    @tufcoder

    Hello! First congratulations on finishing the challenge!

    I'm having a little difficulty giving some specific code feedback, it seems to me that you know well what you're doing.

    What I can say is that the features are not 100% ok. I had a little trouble getting the App to work, I think you just need to test different ways for the user to enter data and ensure a good flow. For example, I will list some difficulties below:

    • When typing a value in Bill and then clicking on 5%, the calculator shows NaN (Not a Number) and I have to click on Reset
    • The Reset Button is not disabled by default
    • When filling in the Custom input and clicking on a button, for example 5%, the custom input remains filled

    I believe that fixing this flow would make it much better to test/use your calculator!

  • Oswaldo Castro•240
    @tufcoder

    First congratulations on finishing the challenge, the size of the container was a little small. I looked at your code and have some general observations:

    • Both the desktop and mobile versions are a little small compared to the example, but the layout result is present.
    • I don't know if you had difficulties importing the json file and I saw that you added an object with the data in your script, if you have any doubts try looking at my version, loading is very simple, just a Promise returning a json.
    • If you use type="module" in your script tag, you don't need to put it at the end of the body and it also makes it easier to load data.json.
    • To avoid "overflow" of the borders at the bottom of the cards (work, play, etc.), a solution I found is to increase the border-radius of the back container and leave the front one with the normal result, this way the edge of the back container "disappears" and there is no effect at the end (although in the example it had that).

    Stay up the good work!

    Marked as helpful
  • Paul Michael E.•150
    @mellingh
    What are you most proud of, and what would you do differently next time?

    That I finished the project.

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

    JavaScript

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

    .

    Newsletter sign-up form with HTML, CSS and JavaScript

    1
    Oswaldo Castro•240
    @tufcoder

    I really liked your project!

    The gradient on the button is beautiful. The spacing was respected and its layout is practically identical to the example, excellent work!

    Your code is very concise and well done, I only have one thing to say about your JavaScript.

    You can use the defer attribute within the script tag and do not need to use DOMContentLoaded within your script. It's just an alternative.

    Keep up the good work!

  • Oswaldo Castro•240
    @tufcoder

    Hi, I think your work is good but I have some observations:

    • Use more Semantic Tags
    • This helps: Check List
    • Try to adjust the mobile version for the share box to be in the bottom of the container

    Keep coding!

  • Maobugichi•470
    @Maobugichi
    What are you most proud of, and what would you do differently next time?

    Proud that i was able to decipher this in way less time than i thought!

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

    my grid sizing

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

    nothing

    responsive testimonial section with HTML and Grid CSS

    2
    Oswaldo Castro•240
    @tufcoder

    I have some observations about your code:

    • Use more semantic tags like section or article instead div.
    • To a better sizing, try put the grid in a container/wrapper, so you could adjust the width.

    Well done, keep coding!

  • Uzzal Yafi•60
    @uzzalyafi
    What are you most proud of, and what would you do differently next time?

    What you might be proud of:

    • Responsive Design.
    • Visual Appeal.
    • Accessibility.
    • Code Organization.
    • Browser Compatibility.
    • Performance Optimization:
    What challenges did you encounter, and how did you overcome them?

    Here are some potential challenges you may have encountered while working on your project, along with strategies for overcoming them:

    1. Responsive Design Complexity.
    2. Browser Compatibility Issues.
    3. Accessibility Concerns.
    4. Performance Optimization.
    5. Design Consistency.
    6. Cross-device Testing.
    7. Client Feedback and Revisions

    Four card feature section

    1
    Oswaldo Castro•240
    @tufcoder

    Very good work!

    The only thing that I observe is the <br /> tag in the title. Because you use <span> the default display is inline. To avoid use <br /> try to apply in the span the display: inline-block or display: block so the span will be in a "new line".

    To me your HTML is Semantic, if you like I have this link to more information.

View more comments