Developer Tutorials Archives - Nextcloud Regain control over your data Tue, 07 Mar 2023 10:00:16 +0000 en-US hourly 1 https://wordpress.org/?v=6.5.2 https://staging.nextcloud.com/wp-content/uploads/2022/03/favicon.png Developer Tutorials Archives - Nextcloud 32 32 Contribute to the Text app: the hidden gem! https://staging.nextcloud.com/blog/contribute-to-the-text-app-the-hidden-gem/ Tue, 07 Mar 2023 10:00:16 +0000 https://nextcloud.com/?p=101036 Nextcloud Office comes with powerful and visible apps like Talk, Groupware and Deck, but quietly working in the background is perhaps the lesser known Text app. Nextcloud Text is perfect for note-taking, outlines and templates and it is also used in some other apps like Collectives for the text editing component. When you want to […]

The post Contribute to the Text app: the hidden gem! appeared first on Nextcloud.

]]>
Nextcloud Office comes with powerful and visible apps like Talk, Groupware and Deck, but quietly working in the background is perhaps the lesser known Text app.

Nextcloud Text is perfect for note-taking, outlines and templates and it is also used in some other apps like Collectives for the text editing component. When you want to work in a simple and uncluttered environment, Text is your ideal choice. It offers a variety of rich formatting options without the more advanced functionalities of a complete office app like Writer in Nextcloud Office. The Text App saves its files as ‘markdown’ files which is very popular among writers, bloggers and techies alike.

Calling all developers!

Like any app, Text gets regular updates, bug fixing and development, and it is a great place to get started contributing to Nextcloud! Several Nextcloud developers, like Max and Jonas who developed the Collectives app, got their first contributions to Nextcloud in through Text. And if you get involved, you’ll certainly encounter them, triaging issues and fixing bugs!

Do you:

  • Already have experience programming?
  • Are familiar with tools y.js, vue.js and tiptap?
  • Curious to learn about new technologies?

Then you should contribute to the Text App!

The tools being used (y.js, vue.js, tiptap) are all built by people who know their craft, have looked into the problems in depth, and found innovative solutions which makes Text a great place to learn how to build up code for those with some experience in programming.

About y.js

y.js was implemented to solve the problem of merging conflicts while collaborative editing. Dealing with these conflicts is a very interesting challenge that people have studied for decades. The requirement for combining the changes of different people was to have a certain order: the changes of person A would be merged first, then the changes of person B, etc., even if the changes of person A and B were made at the same time. The order has to be respected. This means the submission of the changes was often out of order, changes had to be resubmitted, and the user experience was not smooth. y.js was invented between 2016 and 2020 as part of a research project, and it became the first widely used implementation of a CRDT (conflict-free replicated data types) algorithm for shared editing. CRDTs allow collaborating without worrying about the resolution of conflicts. This means we can allow accepting the changes even if they arrive in different orders. The implementation of y.js in Text resulted in great improvements for the performance and user experience.

Getting started

In the Text repository, there’s a very accessible entry-point for new contributors: all issues are triaged, feedback on pull requests is provided fast, and the team is continuously investing in reducing technical debt.

To get started, a variety of ‘good first issues’ are ready for you! Some of the issues just require a one line change in the code and are a very accessible starting point to get some confidence, while other issues are detailed and provide a great chance to learn how the code is structured. Overall, all issues contain elaborate explanations and help is available if you get stuck!

With that, let’s get going! 👨‍💻👩‍💻

The post Contribute to the Text app: the hidden gem! appeared first on Nextcloud.

]]>
Developer Tutorial #4: Create Dashboard Widgets with Vue.js https://staging.nextcloud.com/blog/developer-tutorial-4-create-dashboard-widgets-with-vue-js/ Wed, 15 Feb 2023 10:18:19 +0000 https://nextcloud.com/?p=97282 Welcome to ➡️ part 4 of the Nextcloud Developer Tutorial Series! 🛠️ The Developer Tutorial Series is a program where we help developers improve their coding skills by providing them the tools and step-by-step guides on a variety of topics to succeed. Nextcloud Dashboard The Dashboard is where you start your day. You have your […]

The post Developer Tutorial #4: Create Dashboard Widgets with Vue.js appeared first on Nextcloud.

]]>
Welcome to ➡ part 4 of the Nextcloud Developer Tutorial Series! 🛠

The Developer Tutorial Series is a program where we help developers improve their coding skills by providing them the tools and step-by-step guides on a variety of topics to succeed.

Nextcloud Dashboard

The Dashboard is where you start your day. You have your cup of coffee ☕ or tea 🍵 in hand, and are ready to start your work.

Who messaged you? Do you have an important email to answer? With Nextcloud Dashboard, you have a quick overview of everything happening in your Nextcloud and can get a productive head start to your day. It makes it easy to pick up where you left off on a project through the Deck widget, for example, or an upcoming Task.

There’s a whole variety of widgets to choose from, and with some practice you can even make your own!

Dashboard on Nextcloud instance with 8 different widgits: upcoming events, talk mentions, upcoming cards, important mail, recommended files, upcoming tasks, recent activity and unread mail.

Start Customizing your own Widget!

Have an idea for a new widget on your dashboard? After completing our fourth tutorial, you will know how to create widgets in Vue.js, an open source, front-end JavaScript model.

Vue.js is mainly utilized for building user interfaces and single-page applications and is known to be a progressive and approachable framework. Learn more about Vue.js here.

In the written tutorial, we first teach you how to create a simple dashboard widget using pure (or vanilla) Javascript and then you will learn how to do it successfully on Vue.js.

View of widgits on Nextcloud dashboard with a photo of northern lights in the background.

We hope you learn from and have fun with this tutorial!

If you have any questions or want to share your new widget, post in the forums!

Check out all the developer tutorials! 👨‍💻👩‍💻

Click here!

The post Developer Tutorial #4: Create Dashboard Widgets with Vue.js appeared first on Nextcloud.

]]>
Learn how to develop a simple interface-only app with Nextcloud! https://staging.nextcloud.com/blog/learn-how-to-develop-a-simple-interface-only-app-with-nextcloud/ Wed, 07 Dec 2022 10:19:29 +0000 https://nextcloud.com/?p=81385 Do you like cats? How about developing an app? Well, we’re back with a new app development tutorial that features cat gifs! 😻 Tutorial #3: Develop a simple interface-only app Our latest tutorial is a step-by-step guide on how to develop a simple interface-only app. You will learn how to: The final product is a […]

The post Learn how to develop a simple interface-only app with Nextcloud! appeared first on Nextcloud.

]]>
Do you like cats?

How about developing an app?

Well, we’re back with a new app development tutorial that features cat gifs! 😻

Tutorial #3: Develop a simple interface-only app

Our latest tutorial is a step-by-step guide on how to develop a simple interface-only app.

You will learn how to:

  1. Compile javascript
  2. Manage network requests

The final product is a relatively simple app that displays and resizes cat gifs.

Doing this tutorial is a great way to grasp more fundamental basics about app development that will help you on your development journey.

⚠ Tutorial #3 – developing a simple interface-only app – may be more complex than our previous tutorials due to the longer length and more topics covered.

Nextcloud’s app development series

This tutorial is part of our app development series which also features developing a simple files plugin and setting up your own development environment for Mac, Ubuntu and NEW with Windows.

Find all the tutorials here.

The post Learn how to develop a simple interface-only app with Nextcloud! appeared first on Nextcloud.

]]>
Nextcloud App Development Tutorials: 1 step closer to creating an app! https://staging.nextcloud.com/blog/nextcloud-app-development-tutorials/ Tue, 25 Oct 2022 08:00:00 +0000 https://nextcloud.com/?p=72637 Nextcloud is offering new development tutorials for developers interested in creating their own Nextcloud apps. Learn about our method and how you can get started today!

The post Nextcloud App Development Tutorials: 1 step closer to creating an app! appeared first on Nextcloud.

]]>
Does it ✨ excite ✨ you when new Nextcloud Apps come out?

Perhaps the Cookbook app brought you joy to store all your favorite recipes, or the Bookmarks app helped you organize your favorite websites.

But what if you have 💡the best idea 💡 for an app that would help you and others, but nobody has done it yet?

What if we told you YOU could develop one yourself?

Image of someone's hand hovering over a green post-it note about to write something with lots of paper everywhere underneath, pens and highlighters in the backdrop and a black phone on the homepage screen in the background.

Well, we are happy to announce that we now offer Nextcloud App development tutorials!

Nextcloud App development tutorials

It’s hard to get into the coding world sometimes even with all the information out there.

Tutorials offered online are often very hard and stressful to follow and leave you feeling defeated and disappointed.

We are offering a different approach.

Our tutorials are:

  • Written in a language that does not assume pre-knowledge
  • Meant to enable any developer who wants to enter into the world of Nextcloud
  • Tested by someone who is not a developer, to ensure the tutorials are easy to follow

So if you lack extensive coding experience or are hesitant to start, we are providing you with all the guidance, instructions and support you need in these new tutorials.

What’s inside?

Nextcloud app development tutorials page.

In the Nextcloud folder – Nextcloud app development tutorials final – we are providing tutorials for:

  • Setting up a development environment
    • Tutorial for Mac
    • Tutorial for Ubuntu
  • Developing a simple files plugin

More coming soon!

We love to support our community

We really want to provide our community members the best experience possible, especially if it’s their first attempt at a Nextcloud coding project! Our goal is that these tutorials put you at ease and help flatten the learning curve.

See what some participants have already said about our development tutorials:

“Great job! This is certainly a much better experience than I had bootstrapping my first app back then. Very approachable 👍.”

– theCalcaholic , NextcloudPi Developer

“Thank you so much. This is really very helpful for me. I am looking forward to further tutorials.”

– olheem
Light bulbs in different colors in a row.

Already an expert?

Help the next generation of #Nextcloud app developers and contribute to this project!

We need:

  • Create tutorials about setting up a development environment in the same format for other operating systems
  • Help with answering the questions that arrive on the forum posts [1] [2]

The post Nextcloud App Development Tutorials: 1 step closer to creating an app! appeared first on Nextcloud.

]]>