@Tayara97Submitted 6 months ago
What are you most proud of, and what would you do differently next time?
.
What challenges did you encounter, and how did you overcome them?.
What specific areas of your project would you like help with?.
P
Graeme Byrne
@grmbyrnAll comments
- @grmbyrnPosted 6 months ago
Your code is functional, but several improvements can enhance readability, maintainability, and functionality. Consider using constants for repeated strings and separating logic into smaller, more manageable functions. Improve error handling by providing clear user feedback and ensure that functions focus on a single task. Optimize event listeners by using a single listener for similar elements. Additionally, simplify the reset function for better clarity. These changes will make your code more modular and easier to maintain.
0 - @kanuosSubmitted over 1 year ago
This is my solution to the Time tracking dashboard challenge. Even though the app was fairly simple and mostly needed CSS for layout - I chose to code the entire app using Svelte. Instead of using HTML to render the cards manually, I decided to use the
data.jsonto render the entire UI.Tech Stack
- Svelte.js as UI framework
- Tailwind CSS as styling library
- TypeScript for type-safety
- Vitest, STL for testing the library
- FontSource library for external fonts
Tools used
- VS Code as code editor
- Svelte extension for VS Code
- Firefox and Chrome browser/dev tools
- Git as SVN
- GitHub as code repository
- Netlify for deployment
Check out my solution. Any feedback/suggestion is appreciated :)
- @wcyin9Submitted 6 months agoWhat are you most proud of, and what would you do differently next time?
I had to approach the html and css differently now that I'm including JS, and I see myself improving the logic and planning the more I practice.
What challenges did you encounter, and how did you overcome them?As I'm super new to JS, I found the logic of the language challenging. It was hard for me to decide where to start and what functions to run, especially since there's so many parts to it that I could miss. I had to look for help a lot of the times.
What specific areas of your project would you like help with?If there's any area I could improve on or condense my code, please let me know!
@grmbyrnPosted 6 months agoLooks good, but check your breakpoints. When I make the screen wider, there's a point when it switches to desktop but the content overflows the sides of the pages as it doesn't have enough room. I'd recommend setting your media query to kick in at a wider screen width to avoid that happening.
1 - @mussiehSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
I am proud to write some JavaScript again in a long time. This is not my best work but I will like to polish my solution with animations and transitions.
What challenges did you encounter, and how did you overcome them?I faced some issues toggling the share feature for mobile screens. In the end, I was able to get an acceptable solution.
What specific areas of your project would you like help with?I would like feedback on my approach especially if I made a mistake somewhere.
- @isavarchSubmitted 11 months ago@grmbyrnPosted 6 months ago
The images in the header get cut off at certain page widths. I would recommend reviewing your media queries to make sure that transitioning from mobile to tablet to desktop is smoother for the user. Otherwise, the page looks good so keep it up!
0 - @DAEM007Submitted 6 months agoWhat are you most proud of, and what would you do differently next time?
- I am glad I was able to still get my hands on vanilla css again.
- Although, I implemented the solution in flexbox (cos I was a bit lazy). One thing I would like to do differently next time would be to implement it using css grids...and truly understand the intricate details of how grids work.
- Trying to speed up my dev time to practice for real task when I finally get a role...although, I feel I am getting better at that though.
- None for now.
@grmbyrnPosted 6 months agoAs you say, CSS grid would be the better choice for a layout like this and is also a good chance to practice using it, but you did a good job using flexbox to carry it out.
0 - @DonitronSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
Learned about css grid! Really nice layout tool.
What challenges did you encounter, and how did you overcome them?Had no experience working with the css grid. I used the resources mentioned in the "Building flexible layouts" section.
What specific areas of your project would you like help with?Is it possible to make the grid responsive without using media queries?
@grmbyrnPosted 6 months agoA media query makes this design look a lot better for users on larger screens. It looks good on mobile, but there's a lot of empty space as the screen gets wider.
1 - @AA1057Submitted 6 months agoWhat are you most proud of, and what would you do differently next time?
.
What challenges did you encounter, and how did you overcome them?..
What specific areas of your project would you like help with?.
@grmbyrnPosted 6 months agoI think the page transitions better for this project with a higher media query, I put 1100px for my breakpoint, but that's personal opinion. Good job overall!
1 - @MrestebanNevaSubmitted 7 months agoWhat are you most proud of, and what would you do differently next time?
Encontre algunos problemas usando algunas etiquetas nuevas, como before, pero pde al final usarla.
What challenges did you encounter, and how did you overcome them?NO logre alinear bien algunas partes del texto en especial en las listas por el uso del before.
What specific areas of your project would you like help with?Alineacion de textos, dependiendo su tipo de contenido.
@grmbyrnPosted 6 months ago<ol class="instrutions-list"> <li class="instrutions-item"><h3>Beat the eggs:</h3> In a bowl, beat the eggs with a pinch of salt and pepper until they are well mixed. You can add a tablespoon of water or milk for a fluffier texture.</li> </ol>Es mejor usar
spanen vez deh3aquí y luego aumenta elfont-weighten el CSS. Así, la lista actúa como debería.Marked as helpful0 - @fedefiorettiSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
Like other projects im proud of the result. And this is the first time that i used the terminal and git comands in the right way without mistakes. Also github
What challenges did you encounter, and how did you overcome them?still figuring out how to use properly CSS, so i've found in chat GPT not only solutions but also, and more importantly, explanations...
What specific areas of your project would you like help with?i'd love to read you guys critics or whatever you want to share with me... I'm a rookie student, so still learning here
@grmbyrnPosted 6 months agoThis looks good. In the Figma, it's a little wider on bigger screens. A media query would help accomplish that. But in general, good stuff!
0 - @fedefiorettiSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
Im proud of the result being this one my second challenge.
What challenges did you encounter, and how did you overcome them?I could not insert the svg image properly, so i ask chat GPT for some help and done...
What specific areas of your project would you like help with?i think i don't need to change anything... but im open to critics of course.
- @bingecoder89Submitted 7 months agoWhat are you most proud of, and what would you do differently next time?
I feel proud because I have comleted this challenge which developed my
- willpower
- discipline
- interest
I did not face any big challenges. If there was any then I would say it was Git
What specific areas of your project would you like help with?- responsive web design
