Hola mundo, soy Mohamed Omar y aquí está mi Proyecto cero para el desarrollo de aplicaciones móviles CS50 con React Native, que es una aplicación de tareas pendientes, así que los guiaré a través de mi aplicación de tareas pendientes. Primero: haga clic en el nuevo botón Todo ahora. ingrese un pequeño nombre de tarea pendiente, digamos Todo 1 y luego ok y Todo número 2 y Todo número 3 ahora tenemos el recuento de elementos 3 y el recuento 3 sin marcar y si marco una tarea pendiente, el contador sin marcar cambiará y cambiará nuevamente y cambiará nuevamente y podemos eliminar el Todo de la lista y el elemento Count cambiará y el contador no marcado también cambiará y así es como funciona mi aplicación y ahora voy a guiarte a través de mi código JavaScript aquí tenemos los nombres de clase, los objetos para almacenar la clase. nombres que usaremos para diseñar y aquí hay algunas variables que obtienen los elementos DOM principales para la página de la aplicación TODO para hacer referencia más adelante y aquí hay algunas variables para realizar un seguimiento de los contadores, esta es para el recuento total de elementos y esta para el total recuento sin marcar Y aquí está la función que actualiza los contadores en la página y luego, tenemos la función newTodo Que creará un nuevo Todo para nosotros Primero, le preguntamos al usuario el nombre de la tarea pendiente usando una alerta y aquí hay una declaración if para evitando una entrada nula y luego actualizamos los contadores y aquí creamos el elemento de la lista y le damos un nombre de clase para darle estilo y una identificación que usaremos más adelante y aquí colocaremos el elemento de la lista en la página de la aplicación y luego aquí pondremos la casilla de verificación en la tarea pendiente y le daremos un nombre de clase para darle estilo, un tipo y una identificación que usaremos más adelante y un atributo onClick para llamar a la función CheckTodo y luego lo agregaremos a la tarea pendiente y luego aquí.
Pondremos el texto en la tarea y aquí pondremos el botón Eliminar en la tarea y le daremos un nombre de clase, un nombre, una identificación y un valor que usaremos más adelante en la función de eliminación y un atributo onClick. para llamar a la función Eliminar TODO y luego agregarla al siguiente todo, aquí tenemos la función Verificar TODO que toma la identificación de checkBox como argumento para actualizar el contador de elementos no marcados de acuerdo con este estado de checkBox si está marcado o no usando algunas declaraciones if. y finalmente, aquí tenemos la función eliminar TODO que toma el valor del botón Eliminar como argumento, que es el mismo que el ID de la casilla de verificación y luego obtiene esta casilla de verificación DOM por ID y verifica si el todo está marcado o no, para actualizar los elementos no marcados. contador de acuerdo con eso después de eliminar el Todo y finalmente actualizar el contador de elementos y eso es todo el código JavaScript de mi aplicación.
Ahora voy a guiarte a través del código HTML de mi aplicación y es bastante simple. Acabo de agregar la referencia bootstrap4 aquí y algo de CSS propio. y eso es todo, gracias por ver.