Nuxt, Vue

Добрый день. Под Nuxt 3 не так много нормальных визуальных редакторов с подгрузкой фото. Поэтому решил на эту тему написать целую статью. Итак..приступим Для начала как всегда устанавливаем новый проект Nuxt 3. npx nuxi init nuxt3-editor cd nuxt3-editor npm i Далее ставим сам визуальный редактор npm i @vueup/vue-quill Далее ставим h3-formidable для обработки файлов из визуального редактора и сохранения файлов в папку с нашим проектом npm i h3-formidable В папке components делаем файл Editor.vue...

Добрый день. В данной статье рассмотрим как сделать небольшой тест или опрос для пользователей на Nuxt 3 + supabase. В данной статье не буду рассматривать как установить Nuxt 3 + supabase. Это было рассмотрено в предыдущих статьях. Приступим... Создаем файл opros.vue в папке pages и начинаем его наполнять. <template> <div class="text-white flex justify-center items-center mt-[50px]"> <div v-if="!data.opros" class="flex mb-4 flex-col"> <div v-if="fraze" class="bg-indigo-500 rounded-md w-[300px]">...

Добрый день. Не так давно понадобилось загрузить файл excel в приложение nuxt и сохранить его в базу данных supabase для дальнейшего использования. В этой статье не буду рассказывать как поставить приложение Nuxt 3 и Supabase т.к. это было уже в предыдущих статьях. Итак, приступим. Создаем файл с любым названием в папке pages нашего приложения. В нем сразу же вставляем такой код: <template> <div> <input type="file" @change="addfile" /> </div> </template> Тут мы просто сделали кнопку без всяких стилей для загрузки нашего файла и добавили на эту кнопку функцию addfile...

Добрый день. В этой статье рассмотрим как просто подключить базу данных supabase в Nuxt 3 приложение с нуля. Итак...приступим... 1) Создаем наше приложение Nuxt 3 npx nuxi init nuxt3-supabase На этом шаге делаем инициализацию нашего приложения. Далее в папке с нашим приложением выполняем установку зависимостей и пакетов: npm install Далее устанавливаем модуль supabase в наше приложение для работы с базой npm install @nuxtjs/supabase --save-dev Добавляем @nuxtjs/supabase в раздел modules файла nuxt...

Добрый день. В этой статье рассмотрим как подключить всеми любимую базу на Mongo к Nuxt 3. Итак, приступим. Сразу в корне нашего проекта создаем файлик .env для хранения пути к базе и названия базы с таким содержимым: DATABASE_URL="mongodb://localhost:27017" DBNAME="newblog" DBUSERNAME="" DBPASSWORD="" DBAUTHSOURCE="" Тут по строкам все понятно без разъяснений, в первой строке- путь к базе на локалхосте и вторая строка имя базы. В тесте делаю без логина и пароля к базе. Далее, в папке server в корне нашего проекта, создаем папку plugins и в ней файлик dbconnection...

Добрый день. Вот и подъехала вторая часть статьи про nuxt, в которой мы рассмотрим как реализовать регистрацию пользователей. Итак приступим... Делаем регистрацию пользователей на фронтенде Для начала в командной строке в папке проекта устанавливаем модуль авторизации, пишем npm install --save-exact @nuxtjs/auth-next Заходим в папку pages нашего проекта и в ней создаем файл registration.vue, с таким содержимым: <template> <div> <h1 class="text-center">Регистрация</h1> <v-form @submit.prevent="registerUser"...