Giter Club home page Giter Club logo

modulo-1-evaluacion-intermedia-rociodvn's Introduction

status readme techs

Chat We. with String Projects

This project has been developed for String as our final project for Adalab.

This project is based on the development of a kind of social network focused on messaging. It is intended to facilitate the communication among members of the same channel or private group. This social network will allow us to log in as users, access these groups and be able to send messages within them creating a thread.

This project was developed by:

Bismilah Langford: https://github.com/bismilahlf
Cristina Pérez: https://github.com/crstinapl
María Ramírez: https://github.com/mariavioleta1417
María Victoria Rubio: https://github.com/mariviru
Raquel Villaverde: https://github.com/raquelv85
Raquel Romo: https://github.com/rqlromo

Project structure

The project has been created with React, therefore, its structure is based on components.

Content and Characteristics

  • Login and logout
  • Group listing page
  • Group conversation page
  • Thread page

If you want to contribute:

First of all, you must clone this project from our repository on Github.

Instalation

In order to install the project, you must type npm install into the terminal to install the node modules packages.

Start Project

To start the project, type npm start.

Used technologies

This app has been built using bootstrap,react,javascript,jsx and sass.

Tools

This project has been created with Create React App (https://github.com/facebookincubator/create-react-app), a generating tool that automates the installation of React and Babel, which will transform the ES6 code into ES5 and preconfigure the project.

Below you will find some information on how to perform common tasks. You can find the most recent version of this guide here.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.

The page will reload if you make any changes. You will also see any lint errors in the console.

npm run build

It builds the app for production to the build folder. It correctly sets React into production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes. Your app is ready to be deployed!

See the section about deployment for more information.

modulo-1-evaluacion-intermedia-rociodvn's People

Contributors

rociodvn avatar

modulo-1-evaluacion-intermedia-rociodvn's Issues

Mejoras

Muy buen trabajo @RocioDvn!!!

Aquí tienes unos consejos para mejorar tu ejercicio:

  • HTML > HEADER: La etiqueta img debe tener el atributo title:

    modulo-1-evaluacion-intermedia-RocioDvn/index.html/index.html

    Line 19 in f7f6776

    ><img src="../images/adalab-logo-155x61.png" alt="icono_adalab"
  • HTML > HEADER: Necesitamos al menos una etiqueta header.
  • HTML > HEADER: Crea el menú dentro de una etiqueta nav, y dentro un listado que incluya uno li, con dos etiquetas a .
  • HTML > HEADER: El texto de los enlaces debe ser "Blog" y "Contacto". Debemos ponerlo en mayúsculas con CSS.
  • HTML > HEADER: Los enlaces tienen que tener el atributo title.
  • HTML > MAIN: Necesitamos al menos una etiqueta main.
  • HTML > MAIN: Necesitamos al menos una etiqueta h1.
  • HTML > MAIN: El contenido exacto del h1 debe ser "Creando diversidad digital". Debemos poner las primeras letras en mayúsculas con CSS.
  • CSS > ESTILOS REPETIDOS: Hay estilos repetidos en las media queries que no son necesarios, es mejor quitarlos. .icono { display: flex }
  • CSS > COLOR: El color del h1 debe ser blanco
  • CSS > FONT-FAMILY: Es recomendable que la fuente del body sea Rubik para aprovechar la herencia.
  • CSS > FONT-FAMILY: La fuente del h1 debe ser Rubik
  • CSS > FONT-SIZE: El tamaño del h1 en móvil debe ser 30px.
  • CSS > FONT-SIZE: El tamaño del h1 en tablet debe ser 40px.
  • CSS > PADDING: El padding de los enlaces no debería ser 0. Auméntalo para aumentar el área clickable, pero manteniendo los requisitos del diseño.
  • CSS > HEIGHT: El main debe ocupar todo el alto de la página.
  • CSS > FIXED: La cabecera debe estar fija en la parte superior de la página y con top: 0.
  • CSS > FIXED: La cabecera debe medir todo el ancho de la página.
  • CSS > FLEX: La mejor forma de centrar el texto principal es con flex.
  • CSS > FLEX: El texto Creando diversidad digital debe estar centrado horizontal y verticalmente, lo mejor es hacerlo con flex.
  • CSS > FLEX: El HEADER en tablet debe tener los elementos alineados a izquierda y derecha .
  • CSS: Verifica el formato de los estilos css, que tu página cumple con el diseño proporcionado

Es posible que cuando corrijas uno de estos puntos, otros se corrijan solos, ya que unos dependen de otros.

Y recuerda algo muy importante:

  • Escribe tu código en inglés.
  • Escribe todos los ficheros y carpetas en inglés.
  • Los commits también tienen que ser en inglés, empezando por un verbo en infinitivo.

Ánimo y si tienes cualquier duda avísame!!!

Con cada mejora que hagas, márcala como completada en este issue y súbela a este repo.

Este issue ha sido creado automáticamente por ello puede tener algún error, si hay algo que no te encaja escribe por slack al coordinador de Adalab.

Para corregir el ejercicio buscamos determinadas palabras en el código para identificar las secciones. Por ejemplo buscamos Creando para buscar el título de la página. Si has escrito mal alguna palabra en el código es posible que te aparezcan aquí falsos errores.

Por favor no cierres este issue, ya lo haremos nosotros.

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.