Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Learning API, vanilla JS, SASS

Benja.min 740

@BenjaDotMin

Desktop design screenshot for the GitHub user search app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello there! Today I learnt about hitting an API and populating the UI. Built with vanilla JS and sass.

However, I cannot figure out how to format the date that is returned from github. I would like to change "2010-04-26T06:17:58Z" into "25 Jan 2011" for example.

Any pointers are appreciated!

Community feedback

P
Matthias 630

@astragenius

Posted

Hey my friend :) this is my approach:

const formatDate = (date) => {

const newDate = new Date(date);

const day = new Intl.DateTimeFormat('en', { day: '2-digit' }).format(newDate);
const month = new Intl.DateTimeFormat('en', {month: 'short' }).format(newDate);
const year = new Intl.DateTimeFormat('en', {year: 'numeric'}).format(newDate);

return `Joined ${day} ${month} ${year}`;     

}

You take the date from the Github API and make an new Date opject. With "Intl.DateTimeForma"t you have several options to format the date.

Here on MDN Webdoc, you have a more detailed explenation.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat

Have a good day :)

Marked as helpful

1

Benja.min 740

@BenjaDotMin

Posted

@astragenius I really appreciate this, thanks so much!

Code updated and credited.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord