Giter VIP home page Giter VIP logo

website's Introduction

Hi 👋, we're FrontendCafé

A community of people interested in technology and computing where we talk about programming languages, web design, infrastructure, we share doubts, we ask and we answer.

Project Links

Languages and Tools

TypeScript React NextJS Tailwind CSS Sanity Storybook

Getting Started

These instructions will help you install and run the project locally.

Prerequisites

Before you run the project, make sure that you have the following tools and software installed on your computer:

Installation

To install the project on your local machine, follow these steps:

  1. Clone the repository.

    git clone https://github.com/hifrontendcafe/website.git
  2. Navigate to the project directory.

    cd website
  3. Install project dependencies by running the command:

    pnpm install
  4. Get the enviroment variables from Vercel.

    [!NOTE] Contact an administrator to request environment variables; if you already have been granted access to the Vercel's project, just run it.

    vercel env pull

    [!IMPORTANT] Make sure you run it in the project directory!

  5. Link the local repository with the Vercel project.

    vercel link --yes -S hifrontendcafe -p website

Running locally

To run the project, follow these steps:

  1. Start the development server by executing the command:

    pnpm run dev
  2. Open a web browser and navigate to http://localhost:3000 to view the project's home page.

Connect with us

FrontendCafé Twitter FrontendCafé LinkedIn FrontendCafé Discord
FrontendCafé Twitter
Powered by Vercel Sanity

website's People

Contributors

addin avatar agusmar avatar andresrdc avatar dependabot[bot] avatar diego-brunetto avatar diegobrunetto avatar ezequielcaste avatar fedeya avatar franmper avatar giancarlobrusca avatar glrodasz avatar hercase avatar hifrontendcafe avatar javicerodriguez avatar jesuslencina avatar lieta96 avatar marbiano avatar marcosnasa avatar martinacostadev avatar miafate avatar mobregozo avatar rolivencia avatar santiago-j-s avatar santiagoharkes avatar sebasec96 avatar threehdm avatar tonymckes avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

website's Issues

CMYK projects list

It would be awesome to display each iteration in a different (CMYK 1.0, 2.0, 3.0) and add a functionality to order the cards.
If we would like to do it, let's talk about the design with Seba first 😉

Refactor Hero

Dividir el Hero en componentes más pequeños que hagan una sola cosa

Add Twitter link to the cards in Mentorías section

Description

  • As a user I would like to better know the mentors before scheduling a session, so having Twitter as an additional information channel can allow me to check for the mentors' profile.
  • As a mentor I would like some more exposition of my profile in FrontendCafé's web page, to get a more professional impact in the visitors of the Mentorías section of the webpage, with Twitter being one of the de facto online channels for networking.

Identified tasks (Draft)

  • Add the twitter property to the mentor Sanity schema.
  • Retrieve the twitter property when querying for mentors' data in the serverless functions.
  • Add a visual badge that includes the twitter icon in the mentors' card component.
  • Render a clickable link in each mentors profile that has twitter property defined.

Messy footer

Describe the bug
It lost its left margin / padding.

Expected behavior
image

Screenshots
image

404 error

Quería reportar que hace unos minutos estuve navegando por la aplicación web de FrontendCafe y me percaté que desde https://frontend.cafe/docs/codigo-de-conducta los enlaces de la barra de navegación están dirigiendo a una ruta que me parece no existe.

Por ejemplo, si doy clic en el menú en inglés me lleva https://frontend.cafe/docs/ingles y arroja un error al renderizar en esa ruta - un 404 -, pero si estoy en el home, por ejemplo, y presiono doy clic en el menú en inglés me lleva a https://frontend.cafe/ingles y ahí sí funciona.

image

añadir theme color para dispositivos apple

en la metadata de las paginas deberia enviarse un theme color para que en los navegadores apple en iOS y Mac mejore la experiencia y no aparezcan espacios blancos arriba y abajo

Global Settings

La manera de implementar las configuraciones desde backend no es la mas optima ya que la index page recibe static props y hace prop drilling hacia los demas componentes.

Necesitamos una solucion que solo haga una peticion y la data sea accesible desde cualquier parte del proyecto, algo similar a un state global pero con SSG.

Esto nos permitirá incorporar mas opciones de configuraciones dinamicas.

Info util:
vercel/next.js#10909 (reply in thread)
https://www.netlify.com/blog/2020/12/01/using-react-context-for-state-management-in-next.js/

Contact button not showing up

Describe the bug

Due to the update of Taildwind, the color schemes were broken and the button was affected.

To Reproduce
Steps to reproduce the behavior:

  1. Go to FrontendCafe/mentorias
  2. Scroll down to the mentor list

Expected behavior

The contact button should be visible

Screenshots

image

"Contactame" button isn't being rendered

Describe the bug
"Contactame" button isn't being rendered, probably because of Tailwind 2.0 update.

Expected behavior
A clear and concise description of what you expected to happen.
image

Screenshots
image

Hero img isn't responsive

Hero img isn't responsive

Design
A clear and concise description of what you expected to happen.
image

Screenshots
If applicable, add screenshots to help explain your problem.
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.